85

TLDR:有没有人有 protovis 和 D3.js 的经验来阐明两者之间的区别?

过去两周我一直在玩 protovis,到目前为止一切都很好。除了现在,我似乎已经用动画碰到了一点砖墙。

protovis:http: //vis.stanford.edu/protovis/

我想做一些非常简单的动画,但是使用 protovis 感觉不太直观——我开始认为 protovis 从来没有真正用于动画。所以,我开始研究 D3.js:

http://mbostock.github.com/d3/ex/stack.html

它看起来非常相似,但是:

  • 看起来更轻巧
  • 似乎适合与其他 DOM 元素以及 SVG 交互
  • 似乎适合添加动画

任何人都可以阐明任何其他差异吗?

我将非常感谢任何和所有输入

4

3 回答 3

118

我用 Protovis 做了很多工作,用 D3 做了一些事情。除了您提到的几点,我认为以下差异对我来说很突出:

  • Protovis 在您指定的视觉属性之间提供了一个简化的抽象层,而 D3 使用实际的 CSS 和 DOM 规范 - 因此您将使用or代替.width(10)or 。在这些示例中,差异非常小,但是当您在 SVG 图像中绘制一条线时,就会有很大的不同。结果是使用 D3 感觉有点低级——你有更多的控制权,但你必须非常熟悉 SVG 语法才能更容易地完成 Protovis 所做的一些事情。.fillStyle('#00C').style('width', 10).attr('fill', '#00C')

  • 正如您所注意到的,Protovis 全部以 SVG 呈现,而 D3 可以使用 DOM 的其他部分。这意味着,对于不需要基于 SVG 的视觉元素的可视化,即使在不支持 SVG 的浏览器中也可以使用 D3。这也意味着将 HTML 和 SVG 集成到同一个可视化中要容易得多,这对于处理文本之类的事情非常好(Protovis 中的文本操作和布局非常薄弱)。

  • D3 更改或删除了一些基本的 Protovis 实用程序,例如标度和数据操作。我对基本实用程序如pv.sum()pv.mean()没有 D3 等价物一再感到恼火,尽管有些,如.nest(),在两个库之间共享。2012 年 10 月 1 日编辑: D3 已填写其数据实用程序,但仍有一些 Protovis 包含而 D3 没有,例如pv.dictpv.numeratepv.repeat. 据推测,它们被排除在外是因为它们被认为不太有用。

  • D3 为异步请求提供实用程序。当我想在 Protovis 中使用它时,我通常必须使用外部库(即 jQuery)。

  • 与 Protovis 相当详细的文档相比,D3 API 文档几乎完全不完整。编辑 (8/30/13) : D3 现在在 GitHub 上有完整而详细的 API 文档,因此这一点不再相关。

  • 最后,我在动画方面做得不多,但我认为你是完全正确的——D3 提供了比 Protovis 更多的动画支持,尤其是在动画过渡方面。Protovis 可以按需重新渲染部分或全部可视化,但不支持单步执行有限持续时间的动画 - 您必须使用setInterval. D3 似乎使它成为图书馆更不可或缺的一部分。

编辑(2011 年 7 月 12 日):看起来有一个新的主要区别——截至 2011 年 6 月 28 日,Protovis 不再处于积极开发中,而 Protovis 团队正在推动 D3.js。最后一个版本相当稳定,所以这不应该阻止你使用它,但这绝对是一个需要考虑的问题。

于 2011-06-02T17:40:05.090 回答
32

有一个教程详细介绍了D3 和 Protovis之间的差异。我同意@nrabinowitz 的描述,但我会指出我们最近添加了广泛的API 文档

于 2011-06-13T01:02:14.137 回答
6

There is a recent paper from the Authors of Protovis/d3.js published 2011 http://vis.stanford.edu/files/2011-D3-InfoVis.pdf mainly about d3.js but containing some of the reasons why they changed certain things on the way from Protovis to d3.js.

于 2012-01-13T10:32:07.373 回答