Raphael を使用して簡単な描画パッケージを作成しようとしています。
この例では、用紙の端にグリッドが描かれた特定のサイズの用紙を定義しました。私の実際のアプリケーションでは、用紙は div のサイズに設定されています。
フィドルhttp://jsfiddle.net/davidbe/LhWZ5/を参照してください
raphael.pan-zoom パッケージを使用して、スクロール ホイールによるズームとマウスの左ボタンによるパンをサポートしています。
page = Raphael(graph_paper, 402, 602);
panZoom = page.panzoom({ initialZoom: 0,
initialPosition: { x: 0, y: 0},
maxZoom: 30,
minZoom: -10});
panZoom.enable();
ズームインするとうまくいきますが、ズームアウトして Raphael 紙が div よりも小さくなると、グリッド線が div の端まで伸びないという問題があります。ズーム設定に関係なく、グリッド線を常に div の端に表示する方法を見つけようとしています。これを行うには、紙を作成するときに大きな紙サイズを定義して、ズームアウトしても元の紙の一部が表示されるようにする必要があると思います。または、ズームの一部として用紙サイズを変更する必要がある場合があります。いずれにせよ、div の x スクロール バーと y スクロール バーを表示したくありません。
これを見る別の方法は、無限のページ サイズをシミュレートしようとしているということです。これを実装する方法に関する提案はありますか?