如何在谷歌地图中添加两个不同的标记?

Question

我想在谷歌地图中添加两个带有不同图标的不同标记 但是当我选择一个时，第二个标记图标会根据第一个图标替换. 示例：当我单击点时，应将标记添加到地图中，当我单击Restau时，应将另一个标记添加到具有不同标记的地图中，但是我得到了具有相同图标的标记 请问任何解决方案？

map.addListener('click', function (e) {
$(".point").on("click", function () {
pointClicked = true;
restauClicked = false;
});
$(".restau").on("click", function () {
restauClicked = true;
pointClicked = false;
})
var icons = {
iconLocalise: {
url: "assets/img/localise.png", // url
scaledSize: new google.maps.Size(50, 50), // scaled size
origin: new google.maps.Point(0, 0), // origin
anchor: new google.maps.Point(0, 0) // anchor
},
iconRestau: {
url: "assets/img/map-icone.png", // url
scaledSize: new google.maps.Size(50, 50), // scaled size
origin: new google.maps.Point(0, 0), // origin
anchor: new google.maps.Point(0, 0) // anchor
}
};
$("#savePoint").on("click", function () {
if (pointClicked == true) {
placeMarkerAndPanTo(e.latLng, map, icons.iconLocalise)
}
if (restauClicked == true) {
placeMarkerAndPanTo(e.latLng, map, icons.iconRestau)
}
});
});

}
function placeMarkerAndPanTo(latLng, map, icon) {
var marker = new google.maps.Marker({
position: latLng,
map: map,
icon: icon
});
icon = null;
marker = null;
alert(JSON.stringify(icon));
map.panTo(latLng);
}

Answer 1

您可以使用if-else 语句来检查所单击元素的值，以确定将在地图中使用的图标。您可以参考我创建的示例代码，每次我将开关的状态从"默认"更改为"Restau"时，该代码都会使用不同的标记。

这是我在代码中使用的 if else 语句的一个片段。

var iconLook;
//setting condition that check for the value of the Switch to determine the icon
if (switchStatus.checked) {
iconLook = "http://maps.google.com/mapfiles/ms/icons/green-dot.png";
} else {
iconLook = "http://maps.google.com/mapfiles/ms/icons/red-dot.png";
}
//passing the value of the icon in the new marker that is being created
var marker = new google.maps.Marker({
position: latlng,
icon: iconLook,
map: map
});