6

たまたま、HTML Canvas上にZUI（ズーミングユーザーインターフェイス）を作成するという課題に直面しました。このようなインターフェイスの例は、DeepZoomやMicrosoftのSeadragonです。

自分でゼロから作成しなくてもZUIを作成できるライブラリをいくつか見つけようとしています（MacとiOSではすでに作成しています）。

ライブラリに必要な主な機能は次のとおりです。

  1. ある種の「ビュー」を基本要素として持ち、それらを階層的に配置します
  2. ビューにベクターグラフィック、テキスト、画像（オプション）を描画します
  3. 最大200倍にズーム
  4. ビュー（上/下、移動、スクロール）によって処理されるマウスイベント

キャンバス上のZUIについては何も見つからなかったので、（上記の条件に適合しない場合でも）提案は大歓迎です。

4

4 に答える 4

5

これはあなたが始めるかもしれません： https ：//github.com/florianguenther/zui53

ZUI53は、HTML5やCSS3などの新しいテクノロジーを使用して強力なWebベースのズーム可能なユーザーインターフェイス（ZUI）を作成するためのJavaScriptライブラリです。

OpenSeadragonもありますが、Canvasを使用しているかどうかはわかりません。

于 2013-01-07T04:31:15.237 に答える
4

Zoomoozを見たことがありますか？

Zoomoozは、Webページ要素をズームするためのjQueryプラグインです。スライドショーのようなPreziの作成や、画像やその他の詳細へのズームに使用できます。

http://janne.aukia.com/zoomooz

これを使用して、任意のDOM要素にズームできます。ただし、Canvasはズームインするとピクセル化されて表示されるため、CanvasよりもSVGの方がうまく機能します。

于 2013-02-24T20:13:39.423 に答える
2

Piccolo2dは、ほとんどの要件を満たしているようです。Geneaquiltsのビデオを見て、インターフェースでどのように使用したかを示します。

于 2011-10-24T00:29:05.943 に答える
0

HTMLとCSS3を使用するがCanvasを使用しないTaaspace.jsもあります。Taaspaceは、さまざまな入力方法をすべて抽象化して、たとえばタッチスクリーンデバイスと互換性を持たせようとします。このサンプルアプリケーションをチェックしてください。

于 2014-01-31T14:06:22.810 に答える