Tipo errado do método draw () do Google Charts quando fornecido DataTable

Question

Feb 25, 2016, 08:04 PM

javascript google-visualization datatable google-api

Tipo errado do método draw () do Google Charts quando fornecido DataTable

Estou tentando mostrar um gráfico de linhas com um filtro de intervalo no Google Charts usando HTML e Javascript, mas sempre que executo odraw() função, o código informa que eu usei o tipo de dados de dados errado para odraw() argumento (deve ser umDataTable) No entanto, eu construo meus dados usandoarrayToDataTable(), que de acordo com a API do Google Chartsdocumentação, cria uma DataTable. Aqui está o meu código completo:

<html>
    <head>
        <script type="text/javascript" src="http://www.google.com/jsapi"></script>
        <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
        <script type="text/javascript">
            //Chart data
            google.charts.load('current',{'packages':['controls']});
            google.charts.setOnLoadCallback(drawDashboard);

            function drawDashboard(){
                var dataSet = google.visualization.arrayToDataTable([
                    [{label:'date',type:'datetime'},{label:'Bytes from network:Bytes to network',type:'number'}],
                    [new Date(2016,01,23,00,00),1.0],
                    [new Date(2016,01,23,01,00),1.0075187969924813],
                    [new Date(2016,01,23,03,00),1.126865671641791],
                    [new Date(2016,01,24,22,00),0.987012987012987],
                    [new Date(2016,01,25,01,00),1.0],
                    [new Date(2016,01,25,02,00),0.9166666666666666],
                    [new Date(2016,01,25,10,00),1.0],
                    [new Date(2016,01,26,12,00),1.0],
                    [new Date(2016,01,27,17,00),0.9864864864864865],
                    [new Date(2016,01,28,22,00),0.03125],
                    [new Date(2016,02,01,22,00),0.97],
                ]);

                var dashboard = new google.visualization.Dashboard(document.getElementById('dashboard_div'));

                var dateRangeFilter = new google.visualization.ControlWrapper({'controlType':'ChartRangeFilter','containerId':'filter_div','options': {'filterColumnLabel':'date'}});

                var lineChart = new google.visualization.ChartWrapper({'chartType':'LineChart','containerId':'curve_chart','options':{'title': 'Total Bytes from the Source Network to Total Bytes To the Source Network per Day','curveType': 'function','legend': {'postition':'bottom'}}});

                dashboard.bind(dateRangeFilter,lineChart);

                dashboard.draw(dataSet);
            }
        </script>
    </head>
    <body>
        <!--draw charts using corresponding div tags-->
        <div id="dashboard_div">
            <div id="filter_div"></div>
            <div id="curve_chart" style="width:900px;height:500px"></div>
        </div>
    </body>
</html>

Como se pode ver, eu crio uma variável chamadadataSet usandogoogle.visualization.arrayToDataTable(), que retorna umDataTable. Então, na parte inferior dodrawDashboard() método, eu chamodashboard.draw(dataSet), que gera o erro

You called the draw() method with the wrong type of data rather than a DataTable or DataView

Não sei por que está lançando esse erro, poisdataSet é claramente uma instância doDataTable classe. Tentei limpar meu cache e cookies várias vezes, mas sem sucesso.