如何在添加新数据之前清除图表?

时间:2016-04-04 08:53:28

标签: javascript jquery charts google-visualization

我正在使用Google Visualization API。基于来自ajax调用function drawchart()的值生成图表。

然后,用户在文本框中输入值,此点也会添加到图表中(function addUserPoint())。 function addUserPoint2()是自动生成的,也会添加到地图上。 adduserpoint和adduserpoint2的结果之间有一条线。

我的问题:如果用户再次添加新点,图表会添加这些值,之前添加的点会保留在图表上。我想在添加新点之前摆脱adduserpoint和adduserpoint2的结果。我怎样才能做到这一点?

var chartData;
var options2;

function addUserPoint() {
if (chartData.getNumberOfColumns() === 2) {
    chartData.addColumn('number', '');
 }
 var aa= $("#wbtotala").text();
 var bb= $("#wbtotalb").text();
  chartData.addRow([
    parseFloat(bb),
    null,
    parseFloat(aa)
  ]);
  myLineChart.draw(chartData, options2);
}

function addUserPoint2(){
if (chartData.getNumberOfColumns() === 2) {
    chartData.addColumn('number', '');
 }
 myLineChart.draw(0,0, options2);
 var aa2 = fweight;
 var bb2= fcg;

  chartData.addRow([
    parseFloat(bb2),
    null,
    parseFloat(aa2)
  ]);
  myLineChart.draw(chartData, options2);
}

function drawchart() {
 document.getElementById('addPoint').addEventListener('click', addUserPoint, false);
 document.getElementById('addPoint').addEventListener('click', addUserPoint2, false);
      chartData = new google.visualization.DataTable();
      chartData.addColumn('number', 'Sli');
      chartData.addColumn('number', 'Weight');

      for (var i = 0; i < chartdatax.length; i++) {
          chartData.addRow([parseFloat(chartdatax[i]), parseFloat(chartdatay[i])]);
          };


       options2 = {
           height: 500,
           hAxis: {
              title: 'AB',
              gridlines: {
                count: 20
            }
            },
            vAxis: {
              title: 'CD',
              gridlines: {
                count: 15
            }
            },
          chartArea: {top:40, width: "70%", height: "75%"},

          legend: { position: 'none' },
          pointSize: 5
        };

       myLineChart = new google.visualization.LineChart(document.getElementById('myChart2'));

        myLineChart.draw(chartData, options2);
}

2 个答案:

答案 0 :(得分:0)

将chartData设置为addUserPoint();

中的空对象

function addUserPoint() { charData = {}; if (chartData.getNumberOfColumns() === 2) { ... } }

这可以确保无论何时添加新数据,它都会清除以前的数据并且您有一个全新的数据集;)

答案 1 :(得分:0)

使用下面的命令。这里的数据是DataTable变量。

var data = new google.visualization.DataTable();