D3.js vs Raphael.js

Question

我对d3和拉斐尔都非常着迷。我知道Raphael是建立在D3之上并且它跨浏览器兼容，但我不确定哪一个更适合什么情况。有人可以解释一下吗？我的直接用例可能是使用SIMILE时间轴并将其与状态图集合（我打算使用d3 / Raphael）。谢谢！

Answer 1

拉斐尔不是建立在D3上的。

拉斐尔将帮助你绘制元素。 D3更全面，可以帮助您将数据绑定到元素。所以我说D3更强大。 This forum discussion讨论使用D3呈现SIMILE时间轴，它们指的是this project，它在D3中实现了时间轴。所以乍一看，D3就是你的答案。

然而，鉴于D3似乎没有为您处理SIMILE时间轴的小部件，拉斐尔或D3可能是一个不错的选择。也就是说，除了事实上D3与Internet Explorer的早期版本不兼容，如this article.中所述。因此，如果你需要支持早期版本的IE，那么你最好使用Raphael。

Answer 2

D3比Raphael更难学，但在这两种情况下，你还必须学习SVG才能创造更好的动画。另一方面，通常D3可视化比类似的Processing或Raphael示例需要更少的数学，因为已经有许多预先打包的布局。

我认为D3是更好的选择，原因很明显：D3基于当前的Web标准堆栈（HTML，DOM - 即使您讨厌它，您也需要使用它，CSS，SVG，甚至是Canvas），以及是一个处理数据的库。 作为一个数据框架，D3也充满了：

• 吨算法和布局（强制布局，堆栈布局，树木等），
• 一些基本数据争论功能（嵌套，交叉，分组，汇总 - 请参阅以下示例：http://bl.ocks.org/phoebebright/raw/3176159/），
• jQuery样式选择，
• 以及可视化原语（d3.svg带有简单图形所需的一切）。

目前d3在许多情况下不仅比Raphael和Processing更好，而且也是jQuery，underscore.js和其他框架的可行替代品。在它之上构建了许多图表库，因此您可以随时拖放一些很酷的图表并重写它周围的数据包装。

您可以使用此界面找到一些好的时间线示例：http://biovisualize.github.com/d3visualization/#visualizationType=timeline

Answer 3

两者都是不同的动物。

RaphaelJS 简化和扩展基于SVG和VML的矢量图形功能。

D3js 只是操纵DOM并依赖图形标准（SVG和Canvas，在条形图上也可以使用DIV）来绘制。例如，d3.svg.symbol()会返回d参数的内容，以将其传递给SVG上的path元素，但不会自行绘制符号。

您可以使用 D3js 来操纵数据并使用 Raphael 进行绘制。

This blog解释如何合并 D3js + Raphael 。并检查D3 for Raphael实施。

Answer 4

作为一名公共部门顾问，我发现学习拉斐尔对我来说是一个更好的投资，因为很多时候我的客户使用旧版本的浏览器。我目前的客户使用的是IE7，其中拉斐尔完美合作，而D3则不然。

就个人而言，我宁愿使用D3，但从专业角度来说，这不是我现实的情况。