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

私が正しく理解していれば、八角形の8つの点のそれぞれの変換された座標を見つけたいと思います-正しいですか？その場合、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 に答える