CODEWITHSUNDEEP
javascriptgoogle-chromechartsgoogle-visualization
Ashutosh Verma
Ashutosh Verma

Reputation: 309

Google Visualization - TypeError: Cannot read property 'DataTable' of undefined [Chrome specific]

I am using Google Visualization Library my application was working correctly, I am unable to figure out how on chrome (specifically) this err starts coming up. Working fine in Firefox

function drawVisualization() {

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

// Declare columns
data.addColumn('date', 'Day');
data.addColumn('number', 'Person');

// Add data.
data.addRows(countArrayFinal);

// Create and draw the visualization.
new google.visualization.LineChart(document.getElementById('visualization')).draw(data, {
    title: 'Performance',
    width : 700,
    height : 300,
    vAxis : {
        maxValue : 4000
    }
});
}drawVisualization();

Upvotes: 11

Views: 43189

Answers (2)

Alfonso Bravo Molina
Alfonso Bravo Molina

Reputation: 11

I had a similar problem using Google Charts, and this alone did not solved it because the .setOnLoadCallback() method did not waited for the library to load, so I had to turn the function into async and use the await keyword before the google.load() method to force it to wait until it was loaded:

function async drawVisualization() {     
await google.charts.load('current', {packages: ['corechart', 'line']});
google.charts.setOnLoadCallback($scope.dibujarGrafica(cantidadDeCadaIntervalo, modo));

...

Upvotes: 0

davidkonrad
davidkonrad

Reputation: 85528

This error occurs because google visualization is not loaded.

Add this below the drawVisualization function:

google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawVisualization);

instead of 

drawVisualization();

Upvotes: 36

Related Questions