javascript - Raphael.js とドキュメントの高さ

Question

でキャンバスを作成します

var paper = Raphael(domid);
...
paper.height = 600;
paper.width = 600;

パスを描いた後、その一部が見えなくなります (キャンバスの端を超えているため)。でももしそうなら

var paper = Raphael(domid, 600, 600);

全て大丈夫。2 番目と 1 番目のコードの本質的な違いは何ですか?

Answer 1

Rapheal には Paper オブジェクトのセッターがないためwidth、heightそれらを呼び出しても DOM には影響しませんが、Paper オブジェクトにいくつかのプロパティを設定するだけです。

widthコンストラクターでおよびparams を渡すとheight、DOM の SVG タグに影響します。

作成後に用紙の幅と高さを変更したい場合は、SVG タグのスタイル プロパティを次のように設定できます。

var paper = Raphael(domid);
paper.canvas.style.width = '200px';
paper.canvas.style.height = '100px';

ケビンが述べたように、setSizeメソッドを使用して実行時のサイズ変更を処理する方がおそらく良いでしょう。

例えば）

paper.setSize(200,100)

それが役立つことを願っています。

Answer 2

別の解決策が考えられます: var paper = Raphael(domid, '100%', '100%');.