這是我根據(jù)老師課程做的圖表代碼:https://github.com/Wobugaosuni/d3Chart,使用的是4.0以上版本的d3.js,代碼添加了注釋,方便理解。喜歡的就加個星標唄~
@LuckyYang 老師,我的代碼報錯, scale_x(d.Year)=undefined 幫忙分析下唄。
var scale_x = d3.scale.ordinal() .domain(data.map(function(d) { return d.Year; })).rangeBands([0,width],0.1)
var bar = chart.selectAll('g').data(data).enter().append('g').attr('transform',function(d,i){return'translate('+scale_x(d.Year)+',0)'})
var scale_x = d3.scale.ordinal() .domain(data.map(function(d) { return d.Year; })).rangeBands([0,width],0.1)
var bar = chart.selectAll('g').data(data).enter().append('g').attr('transform',function(d,i){return'translate('+scale_x(d.Year)+',0)'})
2016-12-06
補充一下,在d3的4.x版本中,指定曲線擬合方式時interpolate("cardinal")應改為curve(d3.curveCardinal);
本節(jié)源碼 https://github.com/Pearyman/moocDemos/tree/master/imooc/d3/2_5
2016-11-28