ChartWrapper为所有图形渲染相同的输出

时间:2014-03-02 09:30:39

标签: javascript google-visualization google-chartwrapper

使用Google Charts,我正在尝试根据ChartWrapper库在仪表板上绘制2个图表。我将滑块绑定到两个图表,我为其设置了一个ControlWrapper。正如您所看到的,我正在使用2个不同的数据表,其中包含相同的列。我面临的问题是渲染相同图表的两倍,即距离图表。为什么会发生这种情况,我该如何解决这个问题呢?谢谢!

以下是相同的代码:

// Instantiate and draw our Heartrate chart, passing in some options.
  heartrateChart = new google.visualization.ChartWrapper({
    'chartType': 'ColumnChart',
    'containerId': 'heartrate_container',
    'options': {
        'width': width,
        'height': height
    }
});

    dashboard.bind(dateRangeSlider, heartrateChart);

    dashboard.draw(HRdata);


  // Instantiate and draw our Distance chart, passing in some options.
  distanceChart = new google.visualization.ChartWrapper({
    'chartType': 'ColumnChart',
    'containerId': 'distance_container',
    'options': {
        'width': width,
        'height': height
    }
}); 

    dashboard.bind(dateRangeSlider, distanceChart);

dashboard.draw(Distancedata);

1 个答案:

答案 0 :(得分:0)

仪表板只能将一组数据绑定到一组图表和控件。您的代码会将dateRangeSlider绑定到heartrateChart并使用HRdata绘制它们,然后将dateRangeSlider绑定到distanceChart并使用{绘制两个图表 {1}}。如果要使用两个单独的DataTable,则需要有两个Dashboards(每个Dashboard都有唯一的控件),或者需要使用一些技巧来有效地使过滤器在两个数据集上工作。后者可能是你想要的(如果我理解你的意图),所以我会告诉你如何做到这一点:

Distancedata