Mostrar múltiples regiones de gráficos de Google en el mismo mapa

Estoy creando un gráfico geográfico de Google que incluye ciudades de EE. UU., Corea del Sur, Taiwán, China e India. si uso regions: 'world' El mapa será demasiado grande y las burbujas de la ciudad serán apenas visibles. Estoy usando las siguientes opciones:

var options = {
  region: 'world',
  displayMode: 'markers',
  resolution: 'provinces'
}

¿Sería posible crear un mapa con dos o más regiones?

Por ejemplo, Estados Unidos y Asia. Estoy pensando en configurar las regiones usando algo como lo siguiente:

var options = {
  region: '019','142',
  displayMode: 'markers',
  resolution: 'provinces'
}

preguntado el 15 de mayo de 13 a las 04:05

1 Respuestas

No, no es posible crear un mapa de dos regiones en el mismo mapa.

La razón es que los mapas geográficos de Google se basan en imágenes SVG de cualquier región que muestren, y existe una cantidad limitada de mapas SVG dentro de la API (es por eso que algunos países no funcionan con resolution: 'provinces').

Sin embargo, es posible crear una tabla de datos con datos para ambas regiones y usar la misma tabla de datos para completar dos mapas separados (uno de cada área).

Por ejemplo:

<!--
You are free to copy and use this sample in accordance with the terms of the
Apache license (http://www.apache.org/licenses/LICENSE-2.0.html)
-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Google Visualization API Sample</title>
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load('visualization', '1', {packages: ['geochart']});

      function drawVisualization() {
        var data = google.visualization.arrayToDataTable([
          ['Country', 'Popularity'],
          ['Germany', 200],
          ['United States', 300],
          ['Brazil', 400],
          ['Canada', 500],
          ['France', 600],
          ['RU', 700]
        ]);

        // Draw First Chart
        var geochart = new google.visualization.GeoChart(
          document.getElementById('visualization'));
        geochart.draw(data, {width: 556, height: 347, region: '019', resolution: 'countries'});

        // Draw Second Chart
        var geochart2 = new google.visualization.GeoChart(
          document.getElementById('visualization2'));
        geochart2.draw(data, {width: 556, height: 347, region: '150', resolution: 'countries'});
      }


      google.setOnLoadCallback(drawVisualization);
    </script>
  </head>
  <body style="font-family: Arial;border: 0 none;">
    <div id="visualization"></div>
    <div id="visualization2"></div>
  </body>
</html>

También tenga en cuenta que la región "América" ​​(019) es tan alta como el mapa mundial, y en realidad no le ahorrará espacio sobre "mundo". Sugeriría usar América del Norte o simplemente 'EE. UU.' si no hay marcadores en Canadá o México.

contestado el 16 de mayo de 13 a las 00:05

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.