Javascript 个性化d3 x轴标签

我正在制作一个折线图，在谷歌搜索之后，我得出了以下结论：

function maxValue(input) {
          var current = 0;

          for (var i = 0; i < input.length; i++) {
              if (input[i] > current) {
                current = input[i];
              }
          }

          return current;
        }

        var m = [80, 80, 80, 80]; // margins
        var w = 900 - m[1] - m[3]; // width
        var h = 600 - m[0] - m[2]; // height

        var data = [1, 6, 5, 12, 30, 45, 50, 48, 60, 69, 62, 80];

        var months = ["January", "February", "March", "April", "May",
                     "June", "July", "August", "September", "October", 
                     "November", "December"];

        var x = d3.scale.linear().domain([1, 12]).range([0, w]);
        var y = d3.scale.linear().domain([0, maxValue(data)]).range([h, 0]);

        var line = d3.svg.line()
            .x(function(d,i) { 
                return x(i + 1); 
            })
            .y(function(d) {
                return y(d); 
            })

            var graph = d3.select("#graph").append("svg:svg")
                  .attr("width", w + m[1] + m[3])
                  .attr("height", h + m[0] + m[2])
                .append("svg:g")
                  .attr("transform", "translate(" + m[3] + "," + m[0] + ")");

            var xAxis = d3.svg.axis().scale(x).tickSize(-h).tickSubdivide(true);
            graph.append("svg:g")
                  .attr("class", "x axis")
                  .attr("transform", "translate(0," + h + ")")
                  .call(xAxis);


            var yAxisLeft = d3.svg.axis().scale(y).ticks(3).orient("left");
            graph.append("svg:g")
                  .attr("class", "y axis")
                  .attr("transform", "translate(-25,0)")
                  .call(yAxisLeft);

            graph.append("svg:path").attr("d", line(data));

            graph.append("text")
              .attr("x", w/2)
              .attr("y", -20)
              .style("text-anchor", "middle")
              .style("font-size", "18")
              .text("Total Hits in the Last Year");

简单线图

您可以使用xAxis的tickFormat函数从数组中获取月份名称：

var xAxis = d3.svg.axis().scale(x).tickSize(-h).tickSubdivide(true).tickFormat(function(d) {
        return months[d-1]; 
    });

---

你能在这里创建工作代码段吗？@Dinesh，我想是的