D3.js d3js-我的折线图不起作用

我正在尝试使用d3js绘制一个

折线图。但它似乎也不起作用，我没有收到任何
错误

如何克服这个问题。我无法发布你的全部代码，请访问我的plunk查看真正的问题

$(function () {

// the part not working for me

datas.forEach(function(d) {


  d.date = parseDate(d.date);
  d.close = d.close;

  // Scale the range of the data
    x.domain(d3.extent(d, function(d) { 
      return d.date; 

    }));

    y.domain([0, d3.max(d, function(d) { return d.close; })]);

    // Add the valueline path.
    svg.append("path")
        .attr("class", "line")
        .attr("d", valueline(d));

    // Add the X Axis
    svg.append("g")
        .attr("class", "x axis")
        .attr("transform", "translate(0," + height + ")")
        .call(xAxis);

    // Add the Y Axis
    svg.append("g")
        .attr("class", "y axis")
        .call(yAxis);

});


})

错误1:

您在for循环中一次又一次地生成x和y的域

datas.forEach(function(d) {


  d.date = parseDate(d.date);
  d.close = d.close;

  // Scale the range of the data
    x.domain(d3.extent(d, function(d) { 
      return d.date; 

    }));

   svg.append("path")
        .attr("class", "line")
        .attr("d", valueline(d));

你根本不需要for循环。
将所有代码与for循环一起移到外部：

// Get the data 
x.domain(d3.extent(datas, function(d) { 
      d.date = parseDate(d.date);//convert d.date to date using parser.
      return d.date; 
    }));
    y.domain([0, d3.max(datas, function(d) { return d.close; })]);



    // Add the X Axis
    svg.append("g")
        .attr("class", "x axis")
        .attr("transform", "translate(0," + height + ")")
        .call(xAxis);

    // Add the Y Axis
    svg.append("g")
        .attr("class", "y axis")
        .call(yAxis);    
      svg.append("path")
        .attr("class", "line")
        .attr("d", valueline(datas));

最后一个：

而不是在for循环中创建这样的路径

datas.forEach(function(d) {


  d.date = parseDate(d.date);
  d.close = d.close;

  // Scale the range of the data
    x.domain(d3.extent(d, function(d) { 
      return d.date; 

    }));

   svg.append("path")
        .attr("class", "line")
        .attr("d", valueline(d));

应该是

  svg.append("path")
    .attr("class", "line")
    .attr("d", valueline(datas));

工作代码

希望这有帮助