By using the visualization API, i've been able to get a local map of Peru (by province) and got it working correctly while developing our application locally.
The code used to display the map is the following:
function cargarMapa(departamento)
{
var data = google.visualization.arrayToDataTable([
['City'],
[departamento]
]);
var options = {
region: 'PE',
displayMode: 'regions',
resolution: 'provinces',
colorAxis: { colors: ['green'] },
width: 465,
height: 225
};
var geochart = new google.visualization.GeoChart(
document.getElementById('geochart_div'));
geochart.draw(data, options);
}
And it works like a charm when working in my PC:
EXAMPLE:
It works whenever i run the application (im using Visual Studio 2012 and IIS 8) and also when i deploy it on my laptop (FYI, im doing so while being in my University network). BUT, when i deploy this in my University's local server (IIS 7.5), i get the following error:
FYI, i use other charts from the visualization API and they load perfectly
The code is exactly the same so, what could the issue be?
Thanks in advance!
The problem you are having is with this line:
google.setOnLoadCallback(cargarMapa(departamento));
When you include (<arguments>)
after a function name, you are calling the function, which executes immediately and returns some value (null
in the case of cargarMapa
). google.setOnLoadCallback(null);
doesn't do anything, and calling cargarMapa
before the API is done loading causes issues, one of which is that your maps haven't loaded.
To fix this, create a new function that calls cargarMapa(departamento);
:
function init () {
cargarMapa(departamento);
}
and set this as the callback:
google.setOnLoadCallback(init);
Notice there are no parenthesis (()
) after init
- this passes the function init
to the callback handler as an argument, just like a variable (technically, in javascript, functions and variables are the same thing - they're all objects).