了解D3.js-数据可视化
2017-07-26 12:48
155 查看
D3 的全称是(Data-Driven Documents),顾名思义可以知道是一个被数据驱动的文档。听名字有点抽象,说简单一点,其实就是一个 JavaScript 的函数库,使用它主要是用来做数据可视化的。
JavaScript 文件的后缀名通常为 .js,故 D3 也常使用 D3.js 称呼。D3 提供了各种简单易用的函数,大大简化了 JavaScript 操作数据的难度。由于它本质上是 JavaScript ,所以用 JavaScript 也是可以实现所有功能的,但它能大大减小你的工作量,尤其是在数据可视化方面,D3 已经将生成可视化的复杂步骤精简到了几个简单的函数,你只需要输入几个简单的数据,就能够转换为各种绚丽的图形。有过 JavaScript 基础的朋友一定很容易理解它。
一句话:D3.js是一个操纵数据的javascript库!
如何评价 D3.js 这个框架?
d3.js你看成是svg的jQuery就行了。d3.js的所有操作都是真实的dom操作,这和React的vdom完全是两个思路。
当然,d3.js也有可以先计算节点属性,最后挂上dom树的用法,只不过不常用。
操作SVG dom并不是什么了不起的,任何前端程序员操作都可以再短时间内学会操作SVG。
jQuery式的操作,在今天也不是什么先进的东西。
更何况d3的选择器,在我看来,并不是最适合它的交互方式。
d3厉害的地方在于它建立了一整套数据到SVG属性的计算框架,
常用Data visualization模型,大多都可以再d3.layout里面找到,
你常用的几何图形,在d3.svg里面都有。
它为不理解SVG属性计算公式的程序员提供了一整套工具包,让你可以轻松的把数据转换成你想要的SVG属性。而不用把精力耗费在学习如何生成一条path之类的事情上。
现在看来,组件化可以解决HTML排版的很多问题,当然也可以解决SVG排版的问题。
但是,d3作为无数组Data Visualization库的基础,已经太大而不能转型了。
但是你结合d3核心的数学处理模块和最新的组件化框架,很容易就可以做出复用性和易用性都很高的SVG组件。
作者:Twiknight
链接:https://www.zhihu.com/question/38648735/answer/77400803
来源:知乎
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
如何使用?如何安装?参考 学习地址:
http://www.jianshu.com/p/c3800c61d2fb http://www.68kejian.com/page/detail/132/course https://zhuanlan.zhihu.com/p/21897086 http://www.cnblogs.com/tanlujia/p/6376686.html
相关文章推荐
- 数据可视化的优秀入门书籍有哪些,D3.js 学习资源汇总
- 数据可视化的优秀入门书籍有哪些,D3.js 学习资源汇总
- 【D3.JS数据可视化实战记录】绘制条形图
- 我的【数据可视化】——d3.js(2)--绘制简易clock
- d3.js:数据可视化利器之 selection:选择集
- 使用 D3.js 进行简单的数据可视化--折线图
- 【D3.JS数据可视化实战记录】绘制动态状态变化趋势图
- 使用D3.js进行数据可视化
- 利用d3.js对QQ群大数据资料进行可视化分析
- 一小时了解数据挖掘⑥数据挖掘的评估和结果可视化展示
- 数据可视化 D3.js实现力导向图之一(实现按指定字段确定link的source和target)
- 实例教学:使用 D3.js 实现数据可视化
- 【D3.JS数据可视化实战记录】绘制力学图
- 【D3.js数据可视化实战】--(2)本地时间轴
- 用D3.js进行医疗数据可视化 (二)图例 (Legend)
- d3.js(Data-Driven Documents)数据可视化-----初步学习
- 使用D3.js进行数据可视化
- d3.js:数据可视化利器之快速入门
- 用D3.js进行医疗数据可视化 (四) 堆积区图 (Stacked Area Chart)
- 一小时了解数据挖掘⑥数据挖掘的评估和结果可视化展示