Могу ли я подключить два маркера на Google Maps API

Question

Я бы хотел, чтобы функция была, когда пользователь нажимает маркер в местоположении A, появится строка, ведущая к местоположению B. Я пытаюсь создать карту, которая показывает где люди родились и где они живут сейчас.

Очень похоже на сайт Ryanair, где вы наведите курсор на Лондон и увидите все пункты назначения, куда они отправляются.

Спасибо,

Богатые

Answer 1

Я создал простой пример.
Надеюсь, я понял ваш запрос.

Это код:

// Marker locations 
 
var locations = [ 
 
    ['A', -33.890542, 151.274856, 4], 
 
    ['B', -33.923036, 151.139052, 5] 
 
]; 
 
var map; 
 
var markers = []; 
 

 
function init(){ 
 
    // Create new Map 
 
    map = new google.maps.Map(document.getElementById('map_canvas'), { 
 
    zoom: 10, 
 
    center: new google.maps.LatLng(-33.92, 151.25), 
 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }); 
 
    // Get number of Locations 
 
    var num_markers = locations.length; 
 
    // Create Markers 
 
    for (var i = 0; i < num_markers; i++) { 
 
    markers[i] = new google.maps.Marker({ 
 
     position: {lat:locations[i][1], lng:locations[i][2]}, 
 
     map: map, 
 
     html: locations[i][0], 
 
     id: i, 
 
    }); 
 
    // Add onClick Marker Listener 
 
    google.maps.event.addListener(markers[i], 'click', function(){ 
 
     // Create Line 
 
     var flightPath = new google.maps.Polyline({ 
 
     path: [{lat:locations[0][1], lng:locations[0][2]}, {lat:locations[1][1], lng:locations[1][2]}], 
 
     geodesic: true, 
 
     strokeColor: '#FF0000', 
 
     strokeOpacity: 1.0, 
 
     strokeWeight: 2 
 
     }); 
 
     // Add line to map 
 
     flightPath.setMap(map); 
 
    }); 
 
    } 
 
} 
 

 
init();

#map_canvas { 
 
    border:1px solid black; 
 
    height: 400px; 
 
    width: 100%; 
 
    border-radius: 4px; 
 
}

<script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 
 
<div id="map_canvas"></div>

Или вы можете попробовать на JSFiddle

Bye.