1

I'm using the Google Maps api to show a polyline on a google map.

In this fiddle bellow, the polyline is displayed on the map but it's a little offset from the actual polyline decoded from google's Polyline Encoder Utility (in order to show it, you must copy/paste the encoded_data variable from the fiddle to the Encoded Polyline textarea).

function initialize() {
    var map = new google.maps.Map(document.getElementById('map-canvas'), {
        center: {
            lat: 55.570,
            lng: 9.000
        },
        zoom: 10
    });
    var encoded_data = 'qikrIehwu@WOKEIAIBGN?RAj@@f@?RGVO`NOhOSvQSdTUxUUbVUhVCdCEfC{@rUe@`LCt@KjDC`@NPfBl@nA\dH`@nFTh@BdDVPBb@LNJLNHPLn@B\NFNAlB_@^EjAKnAArABjIx@fGr@jG`AtHhAlIrArJxAvKbBhLfBnLdBhLjBxLfB|LnBxLjB`LbBlLdBfL~@hKv@lKn@vKx@lK\|Jd@dADfO[lL]pLWrLY~L_@~LWlABtHx@xOzEjAf@vCxAlCjBjCfC`CxChFrJfBrEzA`FxG~XtEvSlElRZvAXhAtApEDNDHHDLAFSFUFMLMLUDKBO@OB_@?Q?YC[GUOg@I_@COUy@M[MKMG?OEQAOCVPoALsA@QHa@JIDSKO';
    var decode = google.maps.geometry.encoding.decodePath(encoded_data);
    var line = new google.maps.Polyline({
        path: decode,
        strokeColor: '#00008B',
        strokeOpacity: 1.0,
        strokeWeight: 4,
        zIndex: 3
    });
    line.setMap(map);
}
initialize();

Thank you

Fiddle: http://jsfiddle.net/upsidown/g391fmaw/

Adrian
  • 95
  • 1
  • 8
  • 2
    The `\` characters in the string need to be escaped: [fiddle](http://jsfiddle.net/geocodezip/g391fmaw/96/) – geocodezip Nov 06 '17 at 14:14
  • See also: [Directions API overview_polyline doesn't have correct points](https://stackoverflow.com/questions/13360928/directions-api-overview-polyline-doesnt-have-correct-points) – geocodezip Nov 06 '17 at 14:17
  • See also: [Google Maps Decode Path (Polyline) - Uncaught SyntaxError: Unexpected token ILLEGAL](https://stackoverflow.com/questions/33912494/google-maps-decode-path-polyline-uncaught-syntaxerror-unexpected-token-ille) – geocodezip Nov 06 '17 at 14:18
  • Thank a million you geocodezip. It worked – Adrian Nov 07 '17 at 17:18

0 Answers0