在Google 地图上实现做的标记相连接_javascript技巧-js教程-

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