Skip to content
On this page

d3js基础

TIP

分享给大家怎么一步步用d3js + svg 绘图的。

什么是d3Js

TIP

D3js 是一个可以基于数据来操作文档的 JavaScript 库。可以帮助你使用 HTMLCSSSVG 以及 Canvas 来展示数据。D3 遵循现有的 Web 标准,可以不需要其他任何框架独立运行在现代浏览器中,它结合强大的可视化组件来驱动 DOM 操作。 上面是官网的介绍、个人理解就是方便操作dom,实现dom数据绑定是最突出的、最强大优点,其实操作dom得话,就javascript又或者jquery都可以轻松实现。绘制svg用javascriptjquery都可以操作dom进行绘制,but为什么选择d3JS呢?

个人观点理解d3js

TIP

我觉得大家对d3js,不要有错误的理解,它不是一个绘图库,他是一个方便操作dom的库,不是只能用来绘制图形,平常遇到操作dom的话用起来也不错呢。还有说下d3Js的优点:1、实现dom和数据的绑定;2、d3js社区非常好有一系列配套的插件方便你查阅。3、中文文档翻译的也不错方便你学习;

d3Js学习资料

  • 1.中文文档
  • 2.官网
  • 3.社区
  • 4.推荐书籍(图说d3JS)讲的是v3版本的但是基础面很全非常适合新手里面还带你了解基础svg,当然可以在我之前分享的SVG基础学习

基于版本

我再分享中写的案例以及api都是基于d3.v5版本 CDN <script src="https://d3js.org/d3.v5.min.js"></script>

Released under the MIT License.