Skip to content Skip to sidebar Skip to footer

Google Charts Draw() Method Wrong Type When Given Datatable

I am attempting to show a line chart with a range filter in Google Charts using HTML and Javascript, but whenever I run the draw() function, the code tells me that I used the wrong

Solution 1:

Try removing the reference to http://www.google.com/jsapi

You should only need loader.js

I've also found when using loader.js, packages need to be included, in addition to 'controls'

google.charts.load('current', {
    packages: ['controls', 'corechart'],
    callback: drawDashboard
});

functiondrawDashboard() {
    var dataSet = google.visualization.arrayToDataTable([
        [{label:'date',type:'datetime'},{label:'Bytes from network:Bytes to network',type:'number'}],
        [newDate(2016,01,23,00,00),1.0],
        [newDate(2016,01,23,01,00),1.0075187969924813],
        [newDate(2016,01,23,03,00),1.126865671641791],
        [newDate(2016,01,24,22,00),0.987012987012987],
        [newDate(2016,01,25,01,00),1.0],
        [newDate(2016,01,25,02,00),0.9166666666666666],
        [newDate(2016,01,25,10,00),1.0],
        [newDate(2016,01,26,12,00),1.0],
        [newDate(2016,01,27,17,00),0.9864864864864865],
        [newDate(2016,01,28,22,00),0.03125],
        [newDate(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);
}
<scriptsrc="https://www.gstatic.com/charts/loader.js"></script><divid="dashboard_div"><divid="filter_div"></div><divid="curve_chart"style="width:900px;height:500px"></div></div>

Post a Comment for "Google Charts Draw() Method Wrong Type When Given Datatable"