我正在评估Fabric.js http://fabricjs.com/作为替代拉斐尔.js http://raphaeljs.com/用于创建与 IE8 兼容的交互式可视化，IE8 不支持 SVG 或画布（不幸的是，IE8 支持是不可协商的）。
Raphael 可以与可视化库一起使用D3.js http://d3js.org/- 输出 SVG 并且与 IE8 不兼容 - 通过桥接库D34拉斐尔 http://webmonarch.github.io/d34raphael/，适合与 Raphael 一起使用的 D3 分叉。 D34Raphael 采用了一些（但不是全部）D3 功能来输出到 Raphael 的抽象对象而不是 DOM，这样，在 IE8 上，Raphael 可以将 D3 的输出解释为 VML。
（编辑 2014 年 2 月 - D34Raphael 现在似乎已经死了，但有一个名字很棒的替代品R2D3 https://github.com/mhemesath/r2d3/似乎正在积极开发中）
Fabric可以在IE8上输出Canvas（使用excanvas http://excanvas.sourceforge.net/转换为 VML），并且可以将 SVG 转换为交互式 Canvas 元素。因此，从理论上来说，Fabric 似乎有可能取代 Raphael 来桥接 D3 和 IE8。这样做将带来额外的灵活性，还支持 Canvas 功能以及 SVG。
我还没有找到任何与 D34Raphael 相当的 Fabric - 我能找到的最接近的这是演示页面吗 http://shimz.me/example/d3js/fabric/01/这在 IE8 中不起作用。
从我所看到的 Fabric 文档来看，Fabric 似乎可以尝试使用 D34Raphael 之类的东西：它支持转换 SVG 路径、圆形、多边形、折线、椭圆、矩形、直线和图像元素，并且可以处理抽象对象允许持续的交互。这比较 Fabric 处理矢量路径与 Raphael 处理相同路径的性能的基准 http://fabricjs.com/benchmarks/令人印象深刻（尽管没有给出涉及交互或动画的比较基准）。
以几个典型的 D3 项目为例：
- 力定向图 http://bl.ocks.org/mbostock/4062045
- 径向节点链接树图 http://mbostock.github.io/d3/talk/20111116/bundle.html
我确信我不是第一个研究这个问题的人。我不太喜欢尝试实现这样的东西，却发现存在一些不可避免的问题，任何对 Fabric、Canvas 和/或 D3 更有经验的人都可以从一开始就指出。
- 是否有任何现有项目允许使用 Fabric.js 渲染 D3 输出，类似于 D34Raphael？
- 关于 D3 如何与 SVG 配合使用，是否存在无法通过 Fabric 的 SVG 到 Canvas 转换和对象模型进行传输的问题？
- 有没有比 D34Raphael 分叉 D3 项目并调整其输出的方法更简单的方法来通过 Fabric 推送 D3 输出？
我尝试过的：我已经研究过的一些问题：
- Fabric 会遇到与 D34Raphael 类似的问题，即其适应 D3 DOM 查询工具的能力非常有限（因为它适用于抽象对象，而不是 DOM 元素）——但这可以通过组织良好的对象结构来解决。
- Raphael和Fabric都在IE8中使用VML，但是通过不同的引擎，因此Raphael和Fabric的excanvas在VML中实现的功能可能存在差异。在我迄今为止的测试中，两者在 IE8 中的动画和交互性表现都很差，但功能似乎相当，而且 Fabric 似乎比 Raphael 好得多在 IE8 中渲染 VML 文本 https://stackoverflow.com/questions/6110037/raphaeljs-renders-all-text-as-italic-in-ie.
- Fabric 对从 SVG 转换的形状的性能看起来很棒，而且基于 D3 的重绘、交互性和动画似乎应该很流畅，因为这些需要与初始绘制类似的过程（但可能有一些我没有想到的事情）。
- 看来 Fabric 的组更像是 D3 所使用的原生 SVG 组，而不是 Raphael 的组（但我可能在这里忽略了一些东西）。
免责声明：我是 Fabric.js 的作者
非常有趣的问题。为了解决你的观点：
是否有任何现有项目允许使用 Fabric.js 渲染 D3 输出，类似于 D34Raphael？
从来没听说过。但据我所知，D3.js 有 SVG 输出。 Fabric 具有 SVG 解析器，因此将 D3 的标记提供给 Fabric 进行渲染似乎非常简单。
关于 D3 如何与 SVG 配合使用，是否存在无法通过 Fabric 的 SVG 到 Canvas 转换和对象模型进行传输的问题？
我对 D3 不太熟悉，但是看看您链接到的示例之一，我确实看到了一些兼容性问题。我复制了“力定向图”的整个 SVG 标记并将其加载到厨房水槽 http://fabricjs.com/kitchensink/
圆圈渲染得不错，但线条有些不对劲。奇怪的是，所有的行都被正确解析并加载到画布上。但它们是不可见的。为什么？因为它们在 D3.js 中的样式是通过“.line”类定义的，并且我们不支持 Fabric 中的样式表解析。
.link {
stroke: #999;
stroke-opacity: .6;
}
如果我们将这些样式“展开”到每一行（通过“笔画”和“笔画不透明度”属性或样式=“笔画：...;笔画不透明度：...;”），它将按预期工作。
我想圆圈周围白色轮廓的问题有相同的根源。
有没有比 D34Raphael 分叉 D3 项目并调整其输出的方法更简单的方法来通过 Fabric 推送 D3 输出？
实在是想不出什么了。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
