Question

具有D3.JS经验的开发人员是否可以指出实际上哪些特定浏览器和浏览器版本级别最容易支持D3.JS库？

是否有已知与特定浏览器和浏览器版本级别不兼容的D3.JS'组件'列表？

D3.JS网站建议：

Browser Support

D3支持所谓的“现代”浏览器，它通常意味着除IE8及以下版本之外的所有内容。 D3针对Firefox，Chrome（Chromium），Safari（WebKit），Opera和IE9进行了测试。 D3的某些部分可以在旧版浏览器中运行，因为核心D3库具有最低要求：JavaScript和W3C DOM API。对于IE8，建议使用兼容性库Aight。 D3使用Selectors API Level 1，但您可以预加载Sizzle以实现兼容性。你需要一个现代的浏览器来使用SVG和CSS3 Transitions。 D3不是兼容层，所以如果你的浏览器不支持标准，那你就不走运了。遗憾！“

但是，我希望得到一个更具体的答案。

Answer 1

我将在这里讨论并将SVG支持等同于D3支持，因为（在我看来）这是该库中最有用的部分。

考虑到这一点，此链接应该为您提供支持它的确切浏览器版本： http://caniuse.com/svg

这与您从D3网站粘贴的内容相符：基本上除了IE之外，每个主要的浏览器供应商都拥有许多版本的SVG支持。

你的问题是“在实践中”，这意味着SVG。是的，我知道有一些使用D3和DOM的非SVG部分的样本，但gallery中的绝大多数示例都是基于SVG的。

Answer 2

D3是一个用于数据操作的库，其中包含许多使用SVG和Canvas进行数据可视化的辅助工具。

D3旨在让您直接访问HTML和SVG的所有基础功能。这意味着，跨浏览器兼容性受到代码使用的元素和属性的限制，而不是D3本身。

以下是HTML5和CSS3的一些示例：

// Requires HTML5
d3.select('body').append('nav');

// Requires CSS3 transformations
d3.select('div').style('transform', 'matrix(1, -0.3, 0, 1, 0, 0)');

以及SVG和SMIL的一个：

// Requires SMIL
d3.select('rect').append('animate')
   .attr('attributeName', 'x')
   .attr('from', 10)
   .attr('to', 50);

和Canvas的一个：

// Requires Canvas
d3.select('body').append('canvas');

如果我们只考虑D3框架本身（例如仅使用地理投影功能，但没有DOM元素等），跨浏览器的兼容性受到ECMAScript 5的浏览器支持的限制使用map，forEach等

D3.JS浏览器支持

Browser Support

2 个答案: