4

Raphael.jsのメソッドを使用してテキストを作成する際に問題が発生しましprintた。より正確にはgetFont、メソッドが必要とするメソッドは値printを返しundefinedます。問題の原因を見つけるために、ここに非常に単純なフィドルをまとめましたが、これまでのところ運がありません。同じフィドルコードは次のとおりです。

<div id="canvas" style="width:500px; height:300px; outline: 1px solid #000;"></div>​

そしてJavaScript:

var canvas, font, text;

canvas = new Raphael(document.getElementById("canvas", 500, 300));
font = canvas.getFont("Arial");
text = canvas.print(0, 0, "Some text", font, 24).attr({ "fill": "#C00" });​

キャンバスは作成され、パスも描画されますが( fontの値が未定義であるにもかかわらず)、fontオブジェクトはundefinedで返されます。また、「Arial」フォントも試してみました。結局のところ、これら2つは標準であるため、カスタムフォントについては話していません。

なぜこれが起こるのか考えはありますか?

4

1 に答える 1

8

Raphaelのprint方法では、Cufon-font-filesを使用する必要があります。上のドキュメントからgetFont

指定されたパラメータによって、登録されたフォント内のフォントオブジェクトを検索します。

そしてさらに読むregisterFont

Raphaëlの登録済みフォントセットに指定されたフォントを追加します。Cufónのフォントファイル内からの内部呼び出しとして使用する必要があります。

少しねじれた.....

したがって、この方法を使用する必要がある場合は、フォントファイルを変換して正しい形式で提供する必要があります。ここでprint、cufonについてお読みください。

システムフォント(またはWebフォント)を使用する場合Paper.text()は、非常に使いやすい方法を使用でき、CSSなどを使用してテキストのスタイルを設定できます。

于 2012-11-01T08:50:18.583 に答える