D3.JS浏览器支持

Question

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

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

D3.JS网站建议:

浏览器支持

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部分的一些样品,但绝大多数在实例库都是基于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);

和一个画布:

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

如果我们只考虑D3框架本身(例如仅使用地理投影功能,但没有DOM元素等),跨浏览器兼容性是由浏览器支持的有限的ECMAScript 5由于大量使用的map,forEach等等.