Google地图通过外部链接点击标记
谷歌地图，点击外部链接目标标记。 在下面找到小提琴演示。
找小提琴演示
google.maps.event.addListener(marker, 'click', (function(marker, i) { return function() { infowindow.setContent(locations[i][0]); infowindow.open(map, marker); map.setZoom(9); map.setCenter(marker.getPosition()); } })(marker, i)); function triggerClick(i) { google.maps.event.trigger(markers[i],'click'); } 我收到了javascript错误： Uncaught ReferenceError: triggerClick is not defined您的小提琴中Uncaught ReferenceError: triggerClick is not defined 。 triggerClick函数是onLoad函数的本地函数，它需要是全局的才能在HTML单击函数中使用。
更新小提琴
代码段：
var markers = new Array(); var map; var locations = [ ['Delhi International Art Festival, New Delhi
', 28.613939, 77.209021], ['ICCR - Horizon Series, New Delhi
', 28.625439, 77.245715], ['Shree Arobindo Asharam, Pondecherry
', 11.936761, 79.834314], ['With Shuba Mudgal, Florance, Italy
', 43.769560, 11.255814], ['Classical Piano by SAID, London, UK
', 51.507351, -0.127758], ['Piano Unplugged for Nartan Academy, US & Canada
', 40.712784, -74.005941] ]; // Setup the different icons and shadows var iconURLPrefix = 'http://maps.google.com/mapfiles/ms/icons/'; var icons = [ iconURLPrefix + 'red-dot.png', iconURLPrefix + 'green-dot.png', iconURLPrefix + 'green-dot.png', iconURLPrefix + 'red-dot.png', iconURLPrefix + 'purple-dot.png', iconURLPrefix + 'green-dot.png' ] var iconsLength = icons.length; function initialize() { map = new google.maps.Map(document.getElementById('map'), { zoom: 10, center: new google.maps.LatLng(20.59, 78.96), mapTypeId: google.maps.MapTypeId.ROADMAP, mapTypeControl: false, streetViewControl: false, panControl: false, zoomControlOptions: { position: google.maps.ControlPosition.LEFT_BOTTOM } }); var infowindow = new google.maps.InfoWindow({ maxWidth: 160 }); var iconCounter = 0; // Add the markers and infowindows to the map for (var i = 0; i < locations.length; i++) { var marker = new google.maps.Marker({ position: new google.maps.LatLng(locations[i][1], locations[i][2]), map: map, icon: icons[iconCounter], title: 'Click to zoom' }); markers.push(marker); google.maps.event.addListener(marker, 'mouseover', (function(marker, i) { return function() { infowindow.setContent(locations[i][0]); infowindow.open(map, marker); //map.setZoom(9); //map.setCenter(marker.getPosition()); } })(marker, i)); google.maps.event.addListener(marker, 'click', (function(marker, i) { return function() { infowindow.setContent(locations[i][0]); infowindow.open(map, marker); map.setZoom(9); map.setCenter(marker.getPosition()); } })(marker, i)); iconCounter++; // We only have a limited number of possible icon colors, so we may have to restart the counter if (iconCounter >= iconsLength) { iconCounter = 0; } } autoCenter(); } google.maps.event.addDomListener(window, 'load', initialize); function triggerClick(i) { google.maps.event.trigger(markers[i], 'click'); //map.getBounds(); } function autoCenter() { // Create a new viewpoint bound var bounds = new google.maps.LatLngBounds(); // Go through each... for (var i = 0; i < markers.length; i++) { bounds.extend(markers[i].position); } // Fit these bounds to the map map.fitBounds(bounds); }
body { padding: 0; margin: 0; } .container { width: 100%; height: 100%; } .archive-map { width: 100%; height: 400px; } .nav { background: rgba(0, 0, 0, 0.5); width: 100%; text-align: center; margin: 0; padding-left: 0; } .nav li { display: inline-block; } .nav li a { color: #fff; padding: 10px; display: block; position: relative; z-index: 100; }