1

私は接続などで状態マシンを生成するjavascriptライブラリ（jsPlumb）を使用しています.

生成されたグラフにズームインおよびズームアウト機能を追加しようとしています。

生成されたコードは次のようなものです。

<div id="canvas">
    <canvas style="position: absolute; height: 4px; width: 4px; left: 907.816650390625px; top: 659.816650390625px; " class="_jsPlumb_endpoint  ui-draggable ui-droppable" height="4" width="4"></canvas>
     ...

divラッパー内に多くのキャンバス要素があります。

したがって、これらすべてのキャンバス要素を簡単にスケーリングできるライブラリを見つけようとしています。

Fabric.js は良さそうに聞こえますが、キャンバス自体に変換を適用するために既存のキャンバスを「ロード」する方法は見つかりませんでしたが、キャンバス内の要素に変換を適用するだけでした。

それができるライブラリを知っている人はいますか？または、ズームイン/ズームアウト機能をjsplumbに追加するために何かをしたことがあるなら、私も嬉しいです! このライブラリは他の多くの便利な機能を提供するため、Fabric.js を使用したソリューションが特に必要です。

ありがとう！

4

3 に答える 3

2

キャンバス全体をズームしたい場合は、これに興味があるかもしれません...

http://jsfiddle.net/Q3TMA/

canvas.setHeight(canvas.getHeight() * SCALE_FACTOR);
canvas.setWidth(canvas.getWidth() * SCALE_FACTOR);

私はフィドルを作成していません..ランダムなものを検索して見つけただけです。それが役立つことを願っています

于 2013-02-20T02:31:23.767 に答える
0

ズームとビューポートの変更によって fabricjs を拡張する小さな lib を作成しました: https://github.com/wojtek-krysiak/fabricjs-viewport

例: http://wojtek-krysiak.github.io/fabricjs-viewport/

于 2014-07-03T11:50:13.910 に答える