使用 Sigma 库在 Web 应用中绘图

Sigma 是一个致力于在 Web 应用中进行图形绘制的 JavaScript 库，目前其开发团队推出了新的版本。

该 JS 库旨在帮助开发者们创建图形，同时也能够让用户在网页上进行网络操控变得更平顺、更快速。尽管这个新版本的推出是以修复 Bug 为主要目的，但之前的版本——发布于今年年初——完全是从无到有，使用全新架构开发而成。

对于目前的特性列表，Sigma 的网站给出了以下描述：

• 定制渲染——开发者可以使用 Canvas 或 WebGL 内建渲染器，或是甚至自行编写。内建渲染器还提供了许多定制渲染过程的途径。
• 面向交互——开发者可以捕捉用户对某个节点，执行点击鼠标或滑动鼠标滚轮的操作；也可以捕捉用户拖动图形或放大操作，并且总是能够掌握图形相对于屏幕的位置。
• 强大的图形模型——Sigma 只不过是个渲染引擎，但是开发者或许想要做更多的事情，例如运行自己的图形算法。对此，Sigma 提供了可定制的图形模型，开发者可以自行添加定制的数据索引。
• 可扩展——开发插件或简单的代码片段来增强 Sigma 的特性是件很容易的事情。现在，Sigma 的主代码仓库中，已经开放了一些插件，用于读取某些流行图形文件格式或运行复杂布局算法。
• 兼容性——Sigma 适用于所有支持 Canvas 的现代浏览器，但在提供 WebGL 支持的浏览器上运行速度更快。

该 JS 库上月在 Github 上被推荐为最流行的代码库。InfoQ 采访了Sigma 的首席开发人员Alexis Jacomy，以进一步了解该项目：

InfoQ**：开发Sigma背后的动机是什么？**

若干年前，我开始为 Flash 开发 Web 图形绘制工具，以帮助 Gephi 用户在 Web 页面上交互式展现他们的图形。Sigma 最初只是我转向 HTML5 第一步，现在，在某种意义上它已经取得了成功，而这将继续激发我对于它的积极性。

InfoQ**：Sigma的新版本经历了重度重构，你这样做是为了实现什么目标？**

最初 Sigma 的源码非常严格，而且完全未经测试。对我来说，这次重构恰好是解决这些问题的机会。在这个版本中引入了更加一致的 API，并使用了更多单元测试。此外，Sigma 中的每一部分现在都是可覆盖的，这将允许开发者以插件的形式实现几乎任何特性。

InfoQ**：JavaScript领域还有其他一些为图形绘制提供支持的库。那么你认为Sigma何以成为独特的一个？**

Sigma 是一个致力于图形绘制的 JS 库。它的目标是简化基础使用场景，同时也支持整合以用于加倍复杂的应用：

• 以几个内建特性为例，我们可以看到它让开发者能够轻松实现多点触摸、平滑缩放并应对窗台大小调整。
• 它提供了一些更加复杂的特性，并以插件的形式实现了它们。
• 它的 API 和事件系统简化了与图形之间的交互。

InfoQ**：能不能介绍一些现在正在使用Sigma的项目？**

据我目前了解，以下项目正在整合 Sigma 的新版本，但是尚未完成产品化：

来自 Sciences-Po médialab（我当前的雇主，为最新版本的开发提供了经济支持）：

• http://tools.medialab.sciences-po.fr/iwanthue/
• https://github.com/medialab/Hypertext-Corpus-Initiative
• https://github.com/medialab/sciencescape

来自牛津大学互联网研究所（ Oxford Internet Institute ）:

• https://marketplace.gephi.org/plugin/sigmajs-exporter/ ——Sigma 的成功与之息息相关
• https://apps.facebook.com/namegendev/
• http://collegeconnect.us

其他项目：

• http://moviegalaxies.com/
• http://linkurio.us/
• http://app.algopol.fr/

InfoQ**：Sigma项目的计划几乎是什么？**

我的计划基本上是要保持对它的维护，并尝试让更多人参与到核心开发工作中。而且，还有一些特性我目前没有时间去实现，例如 SVG 渲染器或是基于布局算法的 Web 工作器。

查看英文原文： Using Sigma for Drawing Graphs