nvd3 lineplusBarChart 从 javascript 添加值

Question

我有这段代码来生成 lineplusBarChart

HTML

<div id="chart1" class='with-3d-shadow with-transitions'>
    <svg> </svg>
  </div>

脚本

<script src="../lib/d3.v3.js"></script>
<script src="../nv.d3.js"></script>
<script src="../src/models/linePlusBarChart.js"></script>
<script>
var time="1134345600000";
var quantity="12332212"

    var testdata = [
      {
        "key" : "Quantity" ,
        "bar": true,
        "values" : [ [ 1136005200000 , 1271000.0] ]
      }
    ].map(function(series) {
      series.values = series.values.map(function(d) { return {x: d[0], y: d[1] } });
      return series;
    });

testdata[0].values.push([time, quantity]);//NOT SHOWING THE BAR
    var chart;

    nv.addGraph(function() {
        chart = nv.models.linePlusBarChart()
            .margin({top: 30, right: 60, bottom: 50, left: 70})
            .x(function(d,i) { return i })
            .color(d3.scale.category10().range());

        chart.xAxis.tickFormat(function(d) {
          var dx = testdata[0].values[d] && testdata[0].values[d].x || 0;
          return dx ? d3.time.format('%x')(new Date(dx)) : '';
          })
          .showMaxMin(false);

        chart.y1Axis
            .tickFormat(d3.format(',f'));

        chart.y2Axis
            .tickFormat(function(d) { return '$' + d3.format(',.2f')(d) });

        chart.bars.forceY([0]).padData(false);
        //chart.lines.forceY([0]);

        d3.select('#chart1 svg')
            .datum(testdata)
          .transition().duration(500).call(chart);

        nv.utils.windowResize(chart.update);

        chart.dispatch.on('stateChange', function(e) { nv.log('New State:', JSON.stringify(e)); });

        return chart;
    });

</script>

现在我想从 javascript 向图中添加一些变量。假设我有两个变量var time="1134345600000" 和var quantity="12332212"。我想知道如何将这两个变量推送到var testdata.values。

有没有可能的方法？

DEMO（23240行后的js代码）

Answer 1

在您的特定情况下，您需要像这样推送数据：

testdata[0].values.push({x: +time, y: +quantity});

演示here.