0

我有一条创建形状的路径 - 例如。一个八角形

pathdetail="M50,83.33 L83.33,50 L116.66,50 L150,83.33 L150,116.66 L116.66,150 L83.33,150 L50,116.66Z";
paper.path(pathdetail);
paper.path(pathdetail).transform("S3.5");

然后我用它来创建我知道每个角的坐标的形状，因为它们在路径细节中。然后我使用 transform("S3.5") 重新缩放它 - 我需要能够在新的缩放形状中获得每个角的新坐标 - 这可能吗？

4

2 回答 2

2

Raphael 提供了一个将矩阵变换应用于路径的实用程序，首先您需要将变换转换为矩阵，应用变换并将其应用于元素：

var matrix = Raphael.toMatrix(pathdetail, "S3.5");
var newPath = Raphael.mapPath(pathdetail, matrix);
octagon.path(newPath);
于 2013-01-24T15:48:42.657 回答
0

如果我理解正确，您想找到八角形中八个点中每个点的转换坐标——对吗？如果是这样，Raphael 没有为您提供开箱即用的解决方案，但您应该能够使用 Raphael 的一些核心实用功能相对轻松地获得所需的信息。

我的建议是这样的：

var pathdetail = "your path definition here.  Your path uses only absolute coordinates...  right?";
var pathdetail = Raphael.transformPath( pathdetail, "your transform string" );

//  pathdetail will now still be a string full of path notation, but its coordinates will be transformed appropriately

var pathparts = Raphael.parsePathString( pathdetail );
var cornerList = [];

//  pathparts will not be an array of path elements, each of which will be parsed into a subarray whose elements consist of a command and 0 or more parameters.
//  The following logic assumes that your path string uses ONLY ABSOLUTE COORDINATES and does
//  not take relative coordinates (or H/V directives) into account.  You should be able to 
//  code around this with only a little additional logic =)
for ( var i = 0; i < pathparts.length; i++ )
{
    switch( pathparts[i][0] )
    {
        case "M" :
        case "L" :
            //  Capture the point
            cornerList.push( { x: pathparts[i][1], y: pathparts[i][2] } );
            break;
        default :
            console.log("Skipping irrelevant path directive '" + pathparts[i][0] + "'" );
            break;
    }
}

// At this point, the array cornerList should be populated with every discrete point in your path.

这显然是不希望使用内联的代码块，并且只会处理野外路径的子集（尽管它可以扩展为适合通用用途）。但是，对于路径字符串使用绝对坐标的八边形情况，这个——或类似的东西——应该能准确地给你你需要的东西。

于 2013-01-25T00:29:56.230 回答