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>
Intenté hacer esto, pero no funciona (véase la pregunta actualizada). –
¿Se está cargando la biblioteca de geometría? ¿Qué aspecto tienen los mapas de Google? –
http://code.google.com/apis/maps/documentation/javascript/basics.html#Libraries –