2011-05-08 47 views
22

OK, así que tengo un polígono que se representa como una polilínea codificada. Me gustaría poner esto en un mapa, pero no puedo entender la sintaxis. Aquí es lo que tengo:Google Maps: mostrar una polilínea codificada

setRegion = new google.maps.Polyline({ 
    locations: "}[email protected]\[email protected]@r{[email protected]@[email protected]@[email protected]}[email protected]_h|@r{Zad\y|_D}[email protected]@[email protected]}llBpoZqa{@[email protected]~eBaaX}{[email protected]}[email protected]`dYs_NquNgbjAf{[email protected]|[email protected]@}[email protected]}[email protected]|[email protected]@r{ZhjFr}[email protected]}@[email protected]@", 
    levels: "BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB", 
    strokeColor: "#FF0000", 
    strokeOpacity: 0.8, 
    strokeWeight: 2, 
    fillColor: "#FF0000", 
    fillOpacity: 0.35 
    }); 

    setRegion.setMap(map); 

Qué creé usando la Polyline Encoder Tool. De esta misma página obtuve su uso, que es:

The polyline encoding will appear in the Encoded Polyline and Encoded Levels fields below. Use these values for locations and levels when you create your google.maps.Polyline

Sin embargo, el polígono no aparece. ¿Alguien tiene idea de lo que está pasando mal?

ACTUALIZACIÓN

yo probamos este, pero sale el error Uncaught TypeError: Cannot read property 'encoding' of undefined.

<!doctype html> 
<html> 
<head> 
<title>Test</title> 
<meta charset="iso-8859-1"> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?libraries=geometry&sensor=false"></script> 

<style type="text/css"> 
#map {width:670px;height:600px;} 
</style> 
<script type='text/javascript'> 
function initialize() { 
    var myLatlng = new google.maps.LatLng(51.65905179951626, 7.3835928124999555); 
    var myOptions = { 
     zoom: 8, 
     center: myLatlng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 
    var map = new google.maps.Map(document.getElementById("map"), myOptions); 
    var decodedPath = google.maps.geometry.encoding.decodePath("}[email protected]\[email protected]@r{[email protected]@[email protected]@[email protected]}[email protected]_h|@r{Zad\y|_D}[email protected]@[email protected]}llBpoZqa{@[email protected]~eBaaX}{[email protected]}[email protected]`dYs_NquNgbjAf{[email protected]|[email protected]@}[email protected]}[email protected]|[email protected]@r{ZhjFr}[email protected]}@[email protected]@"); 
    var decodedLevels = decodeLevels("BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB"); 

    setRegion = new google.maps.Polyline({ 
     locations: decodedPath, 
     levels: decodedLevels, 
     strokeColor: "#FF0000", 
     strokeOpacity: 1.0, 
     strokeWeight: 2 
    }); 
    setRegion.setMap(map); 

} 

function decodeLevels(encodedLevelsString) { 
    var decodedLevels = []; 

    for (var i = 0; i < encodedLevelsString.length; ++i) { 
     var level = encodedLevelsString.charCodeAt(i) - 63; 
     decodedLevels.push(level); 
    } 
    return decodedLevels; 
} 


</script> 
</head> 


<body onload="initialize()"> 

<div id="map"></div> 

</body> 
</html> 

Respuesta

42

google.maps.geometry.encoding.decodePath (encodedPath: cadena)

http://code.google.com/apis/maps/documentation/javascript/reference.html#encoding

Desde esa página:

var decodedPath = google.maps.geometry.encoding.decodePath(encodedPolyline); 
var decodedLevels = decodeLevels(encodedLevels); 

// Decode an encoded levels string into an array of levels. 
function decodeLevels(encodedLevelsString) { 
    var decodedLevels = []; 

    for (var i = 0; i < encodedLevelsString.length; ++i) { 
    var level = encodedLevelsString.charCodeAt(i) - 63; 
    decodedLevels.push(level); 
    } 

    return decodedLevels; 
} 

Asegúrese de que el libaray geometría está siendo cargado por : http://code.google.com/apis/maps/documentation/javascript/basics.html#Libraries

Trabajo e jemplo de la polilínea codificada en: http://jsfiddle.net/ryanrolds/ukRsp/

+0

Intenté hacer esto, pero no funciona (véase la pregunta actualizada). –

+0

¿Se está cargando la biblioteca de geometría? ¿Qué aspecto tienen los mapas de Google? –

+0

http://code.google.com/apis/maps/documentation/javascript/basics.html#Libraries –

1

No sé por qué, pero si se almacenan las polilíneas y/o niveles codificados en las variables (como elementos de un conjunto de polilíneas), se requiere la función String():

polyLayer = [ 
[['ynh`[email protected]@[email protected]'], 
['PHIHP']], 
... 
]; 

... 
for (var i = 0; i < polyLayer.length; i++) { 
    poly = new google.maps.Polyline({ 
     ..., 
     path: google.maps.geometry.encoding.decodePath(String(polyLayer[i][0])), 
     levels: decodeLevels(String(polyLayer[i][1])), 
     ... 
    }); 
    poly.setMap(map); 
} 
0

tiene ubicaciones :, no la ruta: en sus opciones! Me di cuenta de esto ya que la herramienta del generador indica que debo usar ubicaciones, pero creo que eso es incorrecto, ¡no estoy seguro ya que soy nuevo en esto también! Parece que funciona con path.

10

Si usted está recibiendo este error:

Uncaught TypeError: Cannot read property 'encoding' of undefined 

Entonces no se carga la biblioteca de geometría. Añadir la biblioteca de geometría (& bibliotecas = geometría) a la carga del API de Google Maps como en:

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=geometry"></script> 
Cuestiones relacionadas