d3 4.0版本差异以及mark一些重点
2018-01-05 本文已影响0人
听见vian
最近有一个项目需要用到大屏技术,就想到了d3,以前就听过了一直没合适的机会学起来,想来应该也是跟echart一样,给个数据源就会有图形,没想到是给了个框架,让自己随意发挥而已,要做的还有很多。
前端用的是Vue 的框架,也是初学阶段,搭建环境就不赘述了。参考的网站出自于叫做DecemberCafe的工作室,里面写的技术贴还是比较通俗易懂的,但是最大的问题就是d3的版本问题,遇到的坑真的是多,4.0版本的语法差别还是比较大的,学习的过程中发现一点补充一点。
1.按理来说layout应该是一个比较重要的概念,但是输出了d3的方法可以发现,可以直接使用pie的方法就好了
var pie = d3.layout.pie(); 3.0
var pie = d3.pie(); 4.0
2.在饼状图中,弧生成器写法:
var arc = d3.svg.arc().innerRadius(innerRadius).outerRadius(outerRadius); 3.0
const arc = d3.arc().innerRadius(innerRadius).outerRadius(outerRadius); 4.0
3.交互的操作(mouseover、mouseout、click等)应该写在动画效果(transition)之前,不然会报错。