多个谷歌位置请求功能(药房定位器)

Multiple google places request function (dispensary locator)

本文关键字:定位器 功能 谷歌 位置 请求      更新时间:2023-09-26

我有一个很小的谷歌地图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/

如果有人想看看并给我建议

非常感谢

您当前有一个匿名函数,将其作为第二个参数传递给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);
}