How to connect markers on Google Maps_javascript skills

This is just to tell you how to use the Google Maps API, and it can be considered as an introduction. For some reasons, Google has stayed away from everyone.

Copy code The code is as follows: GeoLocation html, body, #map-canvas { margin: 0; padding: 0; height: 100%; } https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"> > var map; var poly; function initialize() { var myLatlng = new google.maps.LatLng(31.1937077, 121.4158436); var locations = [ ['test1, accuracy: 150m', 31.1937077, 121.4158436, 100], ['test2, accuracy: 150m', 31.2937077, 121.4158436, 100], ['test3, accuracy: 150m', 31.0937077, 121.2158436, 100], ['test4, accuracy: 150m', 31.3937077, 120.4158436, 100], ['test5, accuracy: 150m', 31.1637077, 120.4858436, 100], ['test6, accuracy: 150m', 31.1037077, 121.5158436, 100] ]; var mapOptions = { zoom: 13, center: myLatlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); // 线条设置 var polyOptions = { strokeColor: '#00ff00', // 颜色 strokeOpacity: 1.0, // 透明度 strokeWeight: 4 // 宽度 } poly = new google.maps.Polyline(polyOptions); poly.setMap(map); // 装载 /* 循环标出所有坐标 */ /*for(var i=0; i var loc = []; loc.push(locations[i][1]); loc.push(locations[i][2]); var path = poly.getPath(); //获取线条的坐标 path.push(new google.maps.LatLng(loc[0], loc[1])); //为线条添加标记坐标 //生成标记图标 marker = new google.maps.Marker({ position: new google.maps.LatLng(loc[0], loc[1]), map: map // icon: " https://maps.gstatic.com/mapfiles/markers/marker_green.png " }); }*/ var marker, i, circle; var iwarray = []; var infoWindow; var latlngbounds = new google.maps.LatLngBounds(); var iconYellow = new google.maps.MarkerImage(" http://maps.google.com/mapfiles/ms/icons/yellow-dot.png "); for (i = 0; i var loc = []; loc.push(locations[i][1]); loc.push(locations[i][2]); var path = poly.getPath(); //获取线条的坐标 path.push(new google.maps.LatLng(loc[0], loc[1])); var latlng = new google.maps.LatLng(locations[i][1], locations[i][2]); latlngbounds.extend(latlng); if (locations[i][0].indexOf("[Cached") == 0 || (locations[i][0].indexOf("[Multiple") == 0 && locations[i][0].indexOf("[Cached") >= 0 )) { marker = new google.maps.Marker({ position: latlng, map: map, icon: iconYellow }); var iw = ' ' + locations[i][0] + ' '; } else { marker = new google.maps.Marker({ position: latlng, map: map }); var iw = ' ' + locations[i][0] + ' '; } iwarray[i] = iw; google.maps.event.addListener(marker, 'mouseover', (function(marker,i){ return function(){ infoWindow = new google.maps.InfoWindow({ content: iwarray[i], maxWidth: 200, pixelOffset: new google.maps.Size(0, 0) }); infoWindow.open(map, marker); } })(marker,i)); google.maps.event.addListener(marker, 'mouseout', function() { infoWindow.close(); }); circle = new google.maps.Circle({ map: map, radius: locations[i][3], fillColor: '#0000AA', fillOpacity: 0.01, strokeWeight: 1, strokeColor: '#0000CC', strokeOpacity: 0.8 }); circle.bindTo('center', marker, 'position'); } map.fitBounds(latlngbounds); var listener = google.maps.event.addListenerOnce(map, "idle", function() { var zoomLevel = parseInt(map.getZoom()); if (zoomLevel > 13) map.setZoom(13); }); } google.maps.event.addDomListener(window, 'load', initialize);