Question

如何在Jquery中创建一个仅绘制一个位置的简单地图。这是我现在的代码。这绘制了一系列位置，但我只需要一个简单的地图，用Lng，Lat格式绘制一个点。我正在使用谷歌地理编码器。

var geocoder;
var map;
var markersArray = [];
var bounds;
var infowindow = new google.maps.InfoWindow({
    content: ''
});


function initialize() {
    geocoder = new google.maps.Geocoder();
    bounds = new google.maps.LatLngBounds();

    var myOptions = {
        zoom: 2,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        navigationControlOptions: {
            style: google.maps.NavigationControlStyle.SMALL
        }
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    geocoder.geocode({
        'address': '5th Avenus New Yort'
    }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            map.setCenter(results[0].geometry.location);

            marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location
            });

            bounds.extend(results[0].geometry.location);

            markersArray.push(marker);
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    });

    plotMarkers();
}

var locationsArray = [
    ['Google Official', '1600 Amphitheatre Parkway, Mountain View, USA'],
    ['Google 1', '112 S. Main St., Ann Arbor, USA'],
    ['Google 2', '10 10th Street NE, Suite 600 USA']
];

function plotMarkers() {
    var i;
    for (i = 0; i < locationsArray.length; i++) {
        codeAddresses(locationsArray[i]);
    }
}

function codeAddresses(address) {
    geocoder.geocode({
        'address': address[1]
    }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location
            });

            google.maps.event.addListener(marker, 'click', function() {
                infowindow.setContent(address[0]);
                infowindow.open(map, this);
            });

            bounds.extend(results[0].geometry.location);

            markersArray.push(marker);
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }

        map.fitBounds(bounds);
    });
}

google.maps.event.addDomListener(window, 'load', initialize);

然后我在我的文件中用：

调用它

<body>
    <div id="map_canvas" style="width: 100%; height: 700px;"></div>
</body>

</html>

我需要新地图来绘制一个lat和lng点，同时在教科书中列出如上所述的位置。如果没有数组，我无法弄清楚如何做到这一点。

Answer 1

您似乎正在使用显示多个标记的示例。

我还没有对它进行测试，但我认为这个JavaScript很接近：

getVariable

查看此信息以获取更多信息：https://developers.google.com/maps/documentation/javascript/geocoding

JQuery中的简单地理编码映射

1 个答案: