0
以下代码显示我当前的图表。如何编辑xaxis的标签以显示“2015”,“2016”,“2017”,“2018”和“2019”的年份?我在D3中真的很新。如何更改D3图表中的xaxis标签?
var data = new Array (1, 2, 3, 4, 5);
var x_scale = d3.scale.linear()
.domain([0,d3.max(data, function(d,i) { return i+1 })])
.range([62,540])
var xAxis = d3.svg.axis()
.scale(x_scale)
.tickSize(0,0)
.ticks(5)
.tickPadding(6)
.orient("bottom");
d3.select("svg").append("g")
.call(xAxis)
.attr("class","xaxis")
.attr("transform","translate(0,364)");
var y_scale = d3.scale.linear()
.domain([d3.max(data, function(d) { return d }),0])
.range([54,364])
var yAxis = d3.svg.axis()
.scale(y_scale)
.tickSize(-10,0)
.ticks(5)
.tickPadding(6)
.orient("left");
d3.select("svg").append("g")
.call(yAxis)
.attr("class","yaxis")
.attr("transform","translate(62,0)");
var saeule = d3.select("#saeulen").append("g")
.attr("class","saeule")
.style("color","#F49600");
var bar_padding=10;
var bar_width=x_scale(1)-x_scale(0)-bar_padding;
saeule.selectAll("g")
.data(data)
.enter()
.append ("rect")
.attr("fill","#F49600")
.attr("x" , function (d,i) { return (x_scale(i+1) - (bar_width/2)) })
.attr("y", function (d,i) { return (y_scale(d)) })
.attr("width", bar_width)
.attr("height", function (d,i) { return (y_scale(0)-y_scale(d)) });
好,冬暖夏凉。有用。但正如你的例子,它从2015年开始于0.我该如何解决这个问题?我想从你知道的第一批数据开始。 – johny
我已经向您展示了如何根据您的业务逻辑随意更改滴答功能 – Cyril