如何在TimeFormatD3中添加自定义值？

Question

Q3 1954
Q4 1954
Q1 1955
Q2 1955
Q3 1955
Q4 1955
Q3 1955
Q4 1955
Q1 1956

是否有一个时间格式来指定这样的日期序列到轴在D3和v4？

Answer 1

我发现使用scaleband()可以解决这个问题。

此轴的代码段是

 var width = 800, height = 800;

var ydata = [10, 15, 20, 25, 30];
var svg = d3.select("body")
            .append("svg")
            .attr("width", width)
            .attr("height", height);

var xaxis  = d3.scaleBand()
                .rangeRound([0, width])
                .padding(1);

d3.csv("static/date.csv", function(data){
        xaxis.domain(data.map(function(d) { return d.date; }))

        var x_axis = d3.axisBottom()
                        .scale(xaxis);

        var xAxisTranslate = height/2 + 10;

        svg.append("g")
        .attr("transform", "translate(50, " + xAxisTranslate  +")")
        .call(x_axis)
});

var yscale = d3.scaleLinear()
               .domain([0, d3.max(ydata)])
               .range([height/2, 0]);

var y_axis = d3.axisLeft()
               .scale(yscale);

svg.append("g")
   .attr("transform", "translate(50, 10)")
   .call(y_axis);

我还在这里找到了enter link description的文档