Question

我有一个微小的谷歌地图javascript v3商店定位器，我用它来显示大约5家商店的位置 - 我的问题是，是否有更聪明的方式来制作地点请求和信息窗口比有5个单独的像这样：

  //places request #1
        //place ID for first location
        servicedcd.getDetails({placeId: 'ChIJy_YmBMEMIocRZF8r5wPFMYU'}, 
            function(place, status) {
                if (status === google.maps.places.PlacesServiceStatus.OK) {
                        var marker = new google.maps.Marker({
                         map: map,
                        position: place.geometry.location,
                        icon: 'img/pillicon.jpg'});
                    targetLoc = place.geometry.location;
                    google.maps.event.addListener(marker, 'click', function() {
                         dcdLoc = place.geometry.location;
                        infowindow.setContent('<div><strong class="dmap-title">' + place.name + '</strong></div><br>' +
                        '<div class="dmap-address">' + place.formatted_address + '</div>' +
                        '<div class="dmap-phone">' + place.formatted_phone_number + '</div>' +
                        '<div class="dmap-rating">' + place.rating + '</div>' +                                  
                        '<button onClick="getDirNew(dcdLoc);"><h3>Directions to ' + place.name + '</h3></button>' + 
                        '<a href="' + place.website + '"><h4>Website</h4></a>' + 
                        + 'Place ID: ' + place.place_id + '<br>' +
                        place.formatted_address + '</div>');
                        infowindow.open(map, this);
                        console.log('new dcd geo loc: ' + place.geometry.location);
                    });
                }
          });



//places request #2
            //place ID for second location
            servicedcd.getDetails({placeId: 'ChIJy_YmBMEMIocRZF8r5wPFMYU'}, 
                function(place, status) {
                    if (status === google.maps.places.PlacesServiceStatus.OK) {
                            var marker = new google.maps.Marker({
                             map: map,
                            position: place.geometry.location,
                            icon: 'img/pillicon.jpg'});
                        targetLoc = place.geometry.location;
                        google.maps.event.addListener(marker, 'click', function() {
                             dcdLoc = place.geometry.location;
                            infowindow.setContent('<div><strong class="dmap-title">' + place.name + '</strong></div><br>' +
                            '<div class="dmap-address">' + place.formatted_address + '</div>' +
                            '<div class="dmap-phone">' + place.formatted_phone_number + '</div>' +
                            '<div class="dmap-rating">' + place.rating + '</div>' +                                  
                            '<button onClick="getDirNew(dcdLoc);"><h3>Directions to ' + place.name + '</h3></button>' + 
                            '<a href="' + place.website + '"><h4>Website</h4></a>' + 
                            + 'Place ID: ' + place.place_id + '<br>' +
                            place.formatted_address + '</div>');
                            infowindow.open(map, this);
                            console.log('new dcd geo loc: ' + place.geometry.location);
                        });
                    }
              });

等等。我知道它很糟糕。我已经在AWS上进行测试了

http://52.10.135.217/

如果有人关心看看并给我建议

非常感谢

Answer 1

您目前有一个匿名函数，您将其作为第二个参数传递给servicedcd.getDetails：

然而，您可以做的是将其创建为一个单独的函数，然后您只需按名称传递，例如

function addMarker(place, status) {
    if (status === google.maps.places.PlacesServiceStatus.OK) {
            var marker = new google.maps.Marker({
             map: map,
            position: place.geometry.location,
            icon: 'img/pillicon.jpg'});
        targetLoc = place.geometry.location;
        google.maps.event.addListener(marker, 'click', function() {
             dcdLoc = place.geometry.location;
            infowindow.setContent('<div><strong class="dmap-title">' + place.name + '</strong></div><br>' +
            '<div class="dmap-address">' + place.formatted_address + '</div>' +
            '<div class="dmap-phone">' + place.formatted_phone_number + '</div>' +
            '<div class="dmap-rating">' + place.rating + '</div>' +                                  
            '<button onClick="getDirNew(dcdLoc);"><h3>Directions to ' + place.name + '</h3></button>' + 
            '<a href="' + place.website + '"><h4>Website</h4></a>' + 
            + 'Place ID: ' + place.place_id + '<br>' +
            place.formatted_address + '</div>');
            infowindow.open(map, this);
            console.log('new dcd geo loc: ' + place.geometry.location);
        });
    }
}

servicedcd.getDetails({placeId: 'ChIJy_YmBMEMIocRZF8r5wPFMYU'}, addMarker);

然后，如果唯一不同的是地点ID，您可以将它们放入您循环的数组中：

placeIDs = [
    'ChIJy_YmBMEMIocRZF8r5wPFMYU',
    'ID 2',
    'ID 3'
];

for (var i = 0; i < placeIDs.length; i++) {
    servicedcd.getDetails({placeId: placeIDs[i]}, addMarker);
}

多个谷歌地方请求功能（药房定位器）

1 个答案: