6

碰巧我遇到了在 HTML Canvas 上创建 ZUI（缩放用户界面）的任务。此类界面的示例是 Deep Zoom 和微软的 Seadragon。

我正在尝试找到一些库，这些库允许我创建 ZUI 而无需自己从头开始编写它（尽管我已经为 Mac 和 iOS 完成了它）。

图书馆应具备的主要特点：

  1. 将某种“视图”作为基本元素并按层次排列
  2. 在视图中绘制矢量图形、文本和图像（可选）
  3. 放大至 200 倍
  4. 由视图处理的鼠标事件（上/下、移动、滚动）

任何建议（即使它们不符合上述条件）都将受到欢迎，因为我在画布上没有发现任何关于 ZUI 的信息。

4

4 回答 4

5

这可能会让你开始： https ://github.com/florianguenther/zui53

ZUI53是一个 JavaScript 库，用于使用 HTML5 和 CSS3 等新技术创建强大的基于 Web 的可缩放用户界面 (ZUI)。

还有OpenSeadragon，但我不确定它是否使用 Canvas。

于 2013-01-07T04:31:15.237 回答
4

你看过 Zoomooz 吗？

Zoomooz 是一个用于使网页元素缩放的 jQuery 插件。它可用于制作 Prezi 之类的幻灯片以及缩放到图像或其他细节。

http://janne.aukia.com/zoomooz

您可以使用它缩放到任何 DOM 元素。不过，使用 SVG 比使用 Canvas 效果更好，因为 Canvas 在放大时会显示像素化。

于 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 回答