私は回転しているキャンバス上にたくさんの画像を持っており、raphaeljsとraphael-free-transformプラグインの助けを借りてスケーリングしています
私はこの問題を抱えています。画像オブジェクトの周囲に境界線が必要です。svgでは画像の周囲のストロークが許可されていないため、長方形のストロークを設定して長方形を追加しました。画像とrectをpaper.set()で結合し、セット自体に自由変換を適用します。コードは
img = paper.image(image.src, tx, ty, 362, 500); //main image
rec = paper.rect(tx, ty, 362, 500).attr({'stroke':'#ff00ff','stroke-width':'2'});
var se = $paper.set();
se.push(img);
se.push(rec);
ft = paper.freeTransform(se)
これですべて正常に動作しますが、紙の要素をそのまま複製する必要があります。別のキャンバスでも、raphael.serializeを使用して要素を紙から別の紙にコピーしました。唯一の問題は、要素に適用された変換をコピーすることです。
以前は境界線なしで、すべてのノードが「freeTransform」(raphael-free-transform.jsによって追加された)と呼ばれるプロパティを持っていました。これを使用して、別の紙に複製でコピーします。
しかし、今からset()に無料の変換を適用しているので、このプロパティ値を取得できません。
私の質問が明確であることを願っています。解決策へのポインタは大歓迎です。:)