2011-12-16 8 views
1

私は最近、ラファエルのテキスト機能を使って多くの作業をしており、膨大な数の問題を抱えています。raphaelでテキストを使用しないようにするには?

私のアプリケーションでは、ドラッグ可能なズーム可能なラグラエルセットにテキストを読み込む必要があります。残念ながら、

var title = paper.text(0,0,"this is text"); 
... 
mySet.push(title); 
... 
mySet.animate({scale: ".5 .5 0 0"},1000,function(){...}) 

からのテキストは、セットと一緒にテキストを縮尺しません。

私はこの問題を攻撃するためにpaper.print()を含むさまざまなアプローチを試みましたが、何も問題はありませんでした。

私は、HTML5キャンバスを動的に生成して、必要なテキストと情報を適切に表示し、キャンバスを自分のラッパーに挿入できるイメージに移動することがより意味があると考えていますプロジェクト。

他の解決策を知っている人、またはキャンバスを作成してこのキャンバスのイメージを私のraphaelプロジェクトに取り込む方法はありますか?

答えて

3

HTML5を使用すると効果的です。

私は次のようでした。その後、

var canvas = jQuery("<canvas width=300px height=400px />"); 
var context = canvas[0].getContext("2d"); 

context.font = "10pt Calibri "; 
context.textAlign = "left"; 
context.textBaseline = "top"; 

context.fillText("this is text", xPos, yPos); 

と私のラファエル・セットでそれを実装するために、私がやった:

var img = canvas[0].toDataURL("image/png"); //turns the canvas object into a png and returns the dynamic url 
var bb = mySet.getBBox(); 
mySet.push(
    paper.image(img,bb.x,bb.y,300,400) 
) 
+1

をネイティブラファエルのテキストの品質があるので、これはおそらく非常に便利な統合チップであります一貫性のない – Chasbeen

関連する問題