绘制两条或一组折线答案

【问题标题】：Draw two polylines or a set of them绘制两条或一组折线
【发布时间】：2013-05-23 09:28:55
【问题描述】：

对不起我的英语。我想知道是否可以在地图上绘制两条或更多条不同的折线。例如，从纽约到迈阿密的折线对象和从旧金山到洛杉矶的其他对象。谁能给我一个例子。

【问题讨论】：

This 示例展示了如何执行此类操作。

【解决方案1】：

是的，当然。

<!DOCTYPE html>
<html>
<head>
<title>Draw two polylines</title>

<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map { height: 100% }
</style>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>

<script type="text/javascript">
    function initialize() {
        var NYLatlng = new google.maps.LatLng(40.781321,-73.965855);
        var MiamiLatlng = new google.maps.LatLng(25.786908,-80.226002);
        var SFLatlng = new google.maps.LatLng(37.774514,-122.441311);
        var LALatlng = new google.maps.LatLng(34.041281,-118.240585);

        var map = new google.maps.Map(document.getElementById("map"), {
            zoom: 2,
            center: new google.maps.LatLng(0,0),
            mapTypeId: google.maps.MapTypeId.ROADMAP
        });

        var line1 = new google.maps.Polyline({
            path: [NYLatlng, MiamiLatlng],
            strokeColor: "#FF0000",
            strokeOpacity: 1.0,
            strokeWeight: 1,
            map: map
        });

        var line2 = new google.maps.Polyline({
            path: [SFLatlng, LALatlng],
            strokeColor: "#0000FF",
            strokeOpacity: 1.0,
            strokeWeight: 1,
            map: map
        });

        // make the map zoomed in enough to see all the polylines
        var bounds = new google.maps.LatLngBounds();
        bounds.extend(NYLatlng);
        bounds.extend(MiamiLatlng);
        bounds.extend(SFLatlng);
        bounds.extend(LALatlng);
        map.fitBounds(bounds);
    }

    google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
  <div id="map"></div>
</body>
</html>

【讨论】：