How to connect specific LatLng coordinates with polyline without it automatically connects to other points?

Question

I'm creating a page that shows a world map with markers placed at LatLng coordinates and I'm trying to link them with Polylines. However, I don't want each of them to be linked together. For example, given a set {A,B,C,D,E,F}, the links are A->B, B->C and C->D, also A->E.

When I try to do D->F, D->E magically appears even when I didn't specify it.

Initially I tried with the default path array, but it didn't work so I used another array called coordinates. The first few polylines were drawn from one specific point and it didn't have problems, but when I try to draw from another point to another, it works but polylines that I didn't specify also appeared.

$(document).ready(function() {
        // If the browser supports the Geolocation API
        if (typeof navigator.geolocation == "undefined") {
          $("#error").text("Your browser doesn't support the Geolocation API");
      return;
    }
    // Save the positions' history
    var path = [];

    navigator.geolocation.watchPosition(function(position) {
      // Save the current position
      path.push(new google.maps.LatLng(position.coords.latitude, position.coords.longitude));

      // Create the map
      var myOptions = {
        zoom : 3,
        center : path[0],
        mapTypeId : google.maps.MapTypeId.ROADMAP
      }
      var map = new google.maps.Map(document.getElementById("map"), myOptions);

        path.push(new google.maps.LatLng(2.745537, 101.707316)); //mas
        path.push(new google.maps.LatLng(37.460353, 126.440674)); //kor
        path.push(new google.maps.LatLng(34.789594, 135.438084)); //jpn
        path.push(new google.maps.LatLng(-37.665357, 144.840642)); //aus
        path.push(new google.maps.LatLng(55.410343, 37.902312)); //rus
        path.push(new google.maps.LatLng(40.085148, 116.552407)); //chi
        path.push(new google.maps.LatLng(-6.127211, 106.653684)); //ind
        path.push(new google.maps.LatLng(1.364860, 103.991594)); //sin
        path.push(new google.maps.LatLng(40.760284, -73.772304)); //usa
        path.push(new google.maps.LatLng(53.358796, -2.272773)); //uk
        path.push(new google.maps.LatLng(40.498275, -3.567727)); //spa

      // Create the array that will be used to fit the view to the points range and
      // place the markers to the polyline's points
      var latLngBounds = new google.maps.LatLngBounds();
      for(var i = 0; i < path.length; i++) {
        latLngBounds.extend(path[i]);
        // Place the marker
        new google.maps.Marker({
          map: map,
          position: path[i],
          title: "Point " + (i + 1)
        });
      }
      var coordinates = [
        //mas
        {lat:2.745537, lng:101.707316}, {lat:37.460353,lng:126.440674}, //to kor
        {lat:2.745537, lng:101.707316}, {lat:34.789594,lng:135.438084}, //to jpn
        {lat:2.745537, lng:101.707316}, {lat:-37.665357,lng:144.840642}, //to aus
        {lat:2.745537, lng:101.707316}, {lat:40.085148,lng:116.552407}, //to chi
        {lat:2.745537, lng:101.707316}, {lat:-6.127211,lng:106.653684}, //to ind
        {lat:2.745537, lng:101.707316}, {lat:1.364860,lng:103.991594}, //to sin
        {lat:2.745537, lng:101.707316}, {lat:40.498275,lng:-3.567727}, //to spa

        //kor
        {lat:36.460353, lng:126.440674}, {lat:34.789594,lng:135.438084}, //to jpn
        {lat:36.460353, lng:126.440674}, {lat:55.410343,lng:37.902312}, //to rus
        {lat:36.460353, lng:126.440674}, {lat:40.085148,lng:116.552407}, //to chi

      ];
      // Creates the polyline object
      var polyline = new google.maps.Polyline({
        map: map,
        path: coordinates,
        strokeColor: '#0000FF',
        strokeOpacity: 0.7,
        strokeWeight: 1,
        geodesic: true
      });
      // Fit the bounds of the generated points
      //map.fitBounds(latLngBounds);
      polyline.setMap(map);
    },
    function(positionError){
      $("#error").append("Error: " + positionError.message + "
");
    },
    {
      enableHighAccuracy: true,
      timeout: 10 * 1000 // 10 seconds
    });
  });

https://i.sstatic.net/fzyEf.jpg

I expect the point South Korea to only connects to Moscow, China, Japan and Malaysia, not Spain.

How to connect specific LatLng coordinates with polyline without it automatically connects to other points?

Answers (1)

Related Questions