[GIS] Calling layers from Google Maps API without success

google-maps-apilayersopenlayers-2

I'm following the examples of a free on OpenLayers, in the code below I am calling various layers of google maps api. Have checked with the code book and is correct but nothing appears on the browser.

Tested with one at a time and appeared, does anyone know what is wrong in the code?

Also I've taken the spec version of the api call to google maps and did not work. Nothing appears.

    <!DOCTYPE html>
<html lang='en'>
<head>
 <meta charset='utf-8' />
 <title>My OpenLayers Map</title>
 <script type='text/javascript' src='OpenLayers.js'></script>

 <!-- Chamada a Api Google Maps especificando a versão 3.2 -->
 <script src="http://maps.google.com/maps/api/js?sensor=false&v=3.2"></script>

 <script type='text/javascript'>

 //Variável map
 var map;

 //Função a ser chamada para criar o mapa na leitura da página
 function init() {

 // A classe Map espera dois argumentos "map_element" que o ID do elemento HTLML geralmente uma DIV e opções de mapa {key:value}
 map = new OpenLayers.Map('map_element', {}); 

 //Função de inicialização  - google.maps.MapTypeId.HYBRID (híbrida)
 var google_hybrid = new OpenLayers.Layer.Google(
    "Google Hybrid",
    {type: google.maps.MapTypeId.HYBRID}
    );

 //Função de inicialização  - google.maps.MapTypeId.TERRAIN (topológica)
 var google_physical = new OpenLayers.Layer.Google(
    "Google Physical",
    {type: google.maps.MapTypeId.TERRAIN}
    );

 //Função de inicialização  - google.maps.MapTypeId.TERRAIN (topológica)
 var google_satellite = new OpenLayers.Layer.Google(
    "Google Satellite",
    {type: google.maps.MapTypeId.SATELLITE}
    );

 //Função de inicialização  - google.maps.MapTypeId.ROADMAP (street layer default)
 var google_streets = new OpenLayers.Layer.Google(
    "Google Streets",
    {
        );

//Adiciona as Google Layers ao mapa
map.addLayers([google_hybrid,google_physical,google_satellite,
    google_streets]);


 //Camada de controle que vai mostrar as camadas no mapa
 map.addControl(new OpenLayers.Control.LayerSwitcher());

 //Verifica se o mapa tem um ponto central e o extende a sua extensão máxima
 if(!map.getCenter()){
 map.zoomToMaxExtent();

 }
 }

 </script>
</head>

<body onload='init();'> <!-- Chama a função js init() --> 

<!--Elemento HTML onde o mapa é exibido -->
 <div id='map_element' style='width: 1000px; height: 900px;'>
 </div>

</body>
</html>

Best Answer

By nothing appears in the browser you mean the blank page, right? This happens when you didn't close some brackets ), } or missed "," or ";" etc.

Your layer Google Streets looks strange, it is like you missed the piece of code, you don't say the type and the bracket { is not closed:

//Função de inicialização  - google.maps.MapTypeId.ROADMAP (street layer default)
 var google_streets = new OpenLayers.Layer.Google(
    "Google Streets",
    {
        );
Related Question