使用API​​在Google地图上绘制多个点

Question

我正在尝试使用API​​在Google地图上的任何路线上显示不同的点。我想通过开始，停止和完成位置。这可能是使用JavaScript API还是我需要查看其他选项，如地理位置？

我使用以下代码来实现此目的：

function initialize() {
var mapOptions = {
    zoom: 10,
    center: new google.maps.(-64.397, 150.644),
    mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
}

function loadScript() {
var script = document.createElement("script");
script.type = "text/javascript";
script.src = "http://maps.googleapis.com/maps/api/js?key=52554&sensor=false&callback=initialize";
document.body.appendChild(script);
}

Answer 1

这是我的代码。

`<script type="text/javascript">
    var geocoder = null;
    var arr = new Array();
    var arr1 = new Array();
    var arr2 = new Array();
    var map = null;
    var chr;
    var baseIcon = null;

    function initialize() {
        if (GBrowserIsCompatible()) {
            map = new GMap2(document.getElementById("map_canvas"));
            map.setCenter(new GLatLng('<%=Request["Lat"]%>', '<%=Request["Long"]%>'), 13);
            map.addControl(new GSmallMapControl());
            map.addControl(new GMapTypeControl());

            // Create a base icon for all of our markers that specifies the
            // shadow, icon dimensions, etc.
            baseIcon = new GIcon();
            //        baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
            baseIcon.iconSize = new GSize(25, 30);
            baseIcon.shadowSize = new GSize(37, 34);
            baseIcon.iconAnchor = new GPoint(9, 34);
            baseIcon.infoWindowAnchor = new GPoint(9, 2);
            baseIcon.infoShadowAnchor = new GPoint(18, 25);


            // Creates a marker whose info window displays the letter corresponding to the given index.



            function createMarker(point, index) {
                // Create a lettered icon for this point using our icon class
                var letter = String.fromCharCode("A".charCodeAt(0) + index);
                var letteredIcon = new GIcon(baseIcon);
                letteredIcon.image = "markers/marker" + index + ".png";

                // Set up our GMarkerOptions object
                markerOptions = { icon: letteredIcon };
                var marker = new GMarker(point, markerOptions);

                GEvent.addListener(marker, "click", function () {
                    marker.openInfoWindowHtml("<table><tr><td><img src=markers/marker" + index + ".png length=25 width=25 /></td>" + "<td>" + arr2[index] + "</td></tr></table>");
                });
                return marker;
            }


            for (var i = 0; i < arr.length; i++) {
                var latlng = new GLatLng(arr[i], arr1[i]);
                map.addOverlay(createMarker(latlng, i));                    
            }
        }

    }

`