问题描述
我正在评估，以替代用于创建与IE8兼容的交互式可视化，它不支持SVG或canvas（IE8支持是不可协商的）。
I'm evaluating Fabric.js as an alternative to Raphael.js for creating interactive visualisations that are compatible with IE8, which doesn't support SVG or canvas (IE8 support is non-negotiable unfortunately).
Raphael可以使用可视化库 - 其输出SVG并且与IE8不兼容 - 通过桥接库，D3的分支适合与Raphael一起使用。 D34Raphael适应一些（但不是全部）D3特性输出到Raphael的抽象对象而不是DOM，所以在IE8上，Raphael可以将D3的输出解释为VML。
Raphael can be made to work with the visualisation library D3.js - which outputs SVG and is incompatible with IE8 - via the bridging library D34Raphael, a fork of D3 adapted for use with Raphael. D34Raphael adapts some (but not all) D3 features to output into Raphael's abstracted objects instead of the DOM, so that, on IE8, Raphael can interpret D3's output as VML.
（编辑2014年2月 - D34Raphael似乎已经死了，但有一个非常好的命名的替代
Fabric可以在IE8上输出Canvas（使用转换为VML），并可以将SVG转换为交互式Canvas元素。因此，在理论上似乎可能的是，Fabric可以替换Raphael在桥接D3和IE8。这样做将带来更多的灵活性，也支持Canvas功能以及SVG。
Fabric can output Canvas on IE8 (using excanvas to convert to VML), and can convert SVG to interactive Canvas elements. So, it seems theoretically possible that Fabric could replace Raphael in bridging D3 and IE8. Doing so would bring the added flexibility of also supporting Canvas functionality as well as SVG.
相当于D34Raphael - 最近的我可以找到，不工作在IE8。
I've not found any Fabric equivalent to D34Raphael - the closest I can find is this demo page which doesn't work in IE8.
从我看到的Fabric文档，它看起来像像D34Raphael可以尝试面料：它支持转换SVG路径，圆，多边形，折线，椭圆，直线，线和图像元素，并且与允许进行交互的抽象对象一起工作。
- Force directed graphs
- Radial node-link tree diagrams
我相信我不是第一个研究这个的。我不太喜欢开始尝试实现这样的想法，只是发现有一些不可避免的问题，任何人更有经验的面料，帆布和/或D3可以从一开始就指出。
I'm sure I'm not the first to have looked into this. I don't much like the idea of launching into trying to implement something like this, only to find there's some unavoidable problem that anyone more experienced with Fabric, Canvas and/or D3 could have pointed out from the start.
- 是否有任何现有项目允许使用fabric.js渲染D3输出，类似于D34Raphael？
- 有什么关于D3如何工作与SVG，简单地不能通过布线的SVG到Canvas转换和对象模型管道？
- 有什么简单的方法推出D3输出通过Fabric比D34Raphael分歧D3项目并调整其输出的方法？
已尝试：我已经研究过的一些问题：
What I've tried: Some issues I've already looked into:
- Fabric会有一个类似的问题，D34Raphael在非常限制其适应D3的DOM查询工具的能力（因为它适用于抽象对象，而不是DOM元素） - 但这是一个可以用一个组织良好的对象结构来处理。
- Raphael和Fabric在IE8中使用VML，但是通过不同的引擎，因此Raphael和Fabric的excanvas在VML中实现的功能可能存在差异。在我的测试中，到目前为止，在IE8的动画和互动性能差，但功能看起来可比性，并且Fabric似乎比Raphael更好的
I'm not really familiar with D3, but looking at one of the examples you linked to, I see some compatibility issues indeed. I copied entire SVG markup of "force directed graphs" and loaded it in kitchensink
>
正确呈现圆形，但有些线条没有线。奇怪的是，所有的行都被解析并正确地加载到画布上。但他们不可见。为什么？因为他们在D3.js中的样式是通过.line类定义的，我们不支持在Fabric中进行样式表解析。
Circles are rendered properly-ish, but something is off with lines. Curiously, all the lines are parsed and loaded onto canvas correctly. But they're not visible. Why? Because their styles in D3.js are defined via ".line" class and we don't support stylesheet parsing in Fabric.
.link { stroke: #999; stroke-opacity: .6; }
如果我们要将这些样式展开到每一行If we were to "unroll" those styles unto each line (either via "stroke" and "stroke-opacity" attributes or style="stroke: ...; stroke-opacity: ...;") it would work as expected.
不能想到任何东西。
这篇关于推送D3.js输出通过fabric.js为IE8支持？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！