テキストノードを作成するために、ラファエルJSを使用しました

Question

私はラファエルを使用して、いくつかの図形を構築し、そして今私は彼らにいくつかのテキストを入れたいと思いました。しかし、テキストノードのみを紙やSVGない形状に取り付けることができることを、例から、らしい？

内の異なるテキストを持つ複数の図形を作成することは可能ですか？

私が使用していた例があった。

paper.text(50, 50, "Raphaël\nkicks\nbutt!");

Answer 1

ラファエルでは、全ての描画要素（図形、線、テキストなど）だけ用紙オブジェクトを取り囲むの一部として存在します。それ自体は彼らに何の階層構造はありません。 NOR残念ながら、これらの形状のいずれかのテキスト属性があります。だから、テキストノードは、本来の意味での形状要素に「接続」することはできません。

しかし、あなたは、形状に添付されているテキストノードの外観を与えるために「SET」ノードを使用することができます。セットは、変換（平行移動、回転、等）は、単一の操作ですべてのメンバーに適用することができる素子のアレイです。あなたが1つの長方形と1つのテキストノードを含むセットを作ったのであれば、あなたはそれらを単一のエンティティとして、そのセット要素を扱うことができます。あなたは、そのセットの2番目のインスタンスを作成し、それを異なって扱うことができます。すべてのテキスト要素がまだ技術的には、紙のオブジェクトに属しながら、彼らが長方形に属しているようなので、彼らは（と思われる）に動作します。

例：

var paper = Raphael(0, 0, 400, 400);
for (var i = 0; i < 10; i++)
{
    var group = paper.set();
    group.push(paper.rect(10, 10, 50, 20));
    group.push(paper.text(35, 18, "Hello"));

    group.translate(Math.random() * 350, Math.random() * 380);
    group.rotate(Math.random() * 90);
}

別のアプローチとして、私は、ページ上の別の紙オブジェクトを大量に作成すると、合理的な成功を収めてきました。しかし、それはあなたが行きたい場所はおそらくありません。