ChartRangeSlider - 给定轴上的所有系列必须具有相同的数据类型 - 错误

时间:2014-03-21 15:01:44

标签: javascript google-visualization

我正在写信寻求帮助,出现以下错误 - 给定轴上的所有系列必须具有相同的数据类型---错误,我在客户端获得该错误。

我似乎无法弄清楚,我可能会出错,因为我确保chartWrapper和controlWrapper分配了相同的列。

 <script type="text/javascript">
   function drawVisualization(dataValues, chartTitle, columnNames, categoryCaption) {
    if (dataValues.length < 1)
        return;
    var data = new google.visualization.DataTable();
    data.addColumn('string', columnNames.split(',')[0]);
    data.addColumn('number', columnNames.split(',')[1]);
    data.addColumn('string', columnNames.split(',')[2]);
    data.addColumn('datetime', columnNames.split(',')[3]);
    data.addColumn('number', columnNames.split(',')[4]);

    for (var i = 0; i < dataValues.length; i++) {

        var date = new Date(parseInt(dataValues[i].Date.substr(6), 10));

        data.addRow([dataValues[i].ColumnName, dataValues[i].Value, dataValues[i].Type, date, dataValues[i].ID]);
    }

    // Define a Pie chart
    var pie = new google.visualization.ChartWrapper({
        'chartType': 'LineChart',
        'containerId': 'PieChartContainer',
        'options': {
            'width': 950,
            'height': 450,
            'legend': 'right',
            'chartView': { 'columns': [4, 1] },
            'title': chartTitle,
            'chartArea': { 'left': 100, 'top': 100, 'right': 0, 'bottom': 100 },
            'tooltip': {isHtml: true}
        },
        'view': { 'columns': [4, 1] }
    });

    // Create a chart range slider  
    var myIdSlider = new google.visualization.ControlWrapper({  
    'controlType': 'ChartRangeFilter',  
    'containerId': 'control_div',  
    'options': {  
        'filterColumnLabel': columnNames.split(',')[4],
        'filterColumnIndex': '4',
        'chartView': { 'columns': [4, 1] },
        }
      }); 

    new google.visualization.Dashboard(document.getElementById('PieChartExample')).bind([myIdSlider], [pie]).draw(data);
}

样品:

 <script type="text/javascript">google.load('visualization','1.0',{'packages':  ['corechart','controls']});google.setOnLoadCallback(function(){drawVisualization([{"ColumnName":"HARBM","Value":81,"Type":"TK","Date":"\/Date(1395273600000)\/","ID":541255},{"ColumnName":"HARBM","Value":100,"Type":"TK","Date":"\/Date(1395273600000)\/","ID":541254},{"ColumnName":"INCAPS","Value":88,"Type":"TK","Date":"\/Date(1395273600000)\/","ID":541253},{"ColumnName":"INCAPS","Value":88,"Type":"TK","Date":"\/Date(1395273600000)\/","ID":541252},{"ColumnName":"WBCMT","Value":111,"Type":"TK","Date":"\/Date(1395273600000)\/","ID":541251}],'Text Example','Text Example','Text Example','Type,');});</script></form>

请指教。感谢您的时间和帮助。

1 个答案:

答案 0 :(得分:1)

chartView选项的语法错误:您需要在ChartRangeFilter的选项中设置ui.chartView

var myIdSlider = new google.visualization.ControlWrapper({
    'controlType': 'ChartRangeFilter',
    'containerId': 'control_div',
    'options': {
        'filterColumnIndex': 4,
        'ui': {
            'chartView': { 'columns': [4, 1] }
        }
    }
});

另外,同时设置filterColumnIndexfilterColumnLabel选项无法完成任何操作(filterColumnIndex覆盖filterColumnLabel)。此外,LineCharts没有chartView选项,因此您可以从图表中删除它。