Html 如何在不使用 API 的情况下向嵌入网站的 Google 地图添加其他地图标记？或者是不可能的？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11126396/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to add additional map markers to Google Maps that are embedded on a website without using the API? Or is it impossible?
提问by guptron
Suppose I have 2 office locations which I want to use for my contact page. And I want to have an embedded Google Map that shows both of those locations. In Google Maps itself, I'm able to display both map markers. However, the embed HTML code only uses the first address entered.
假设我有 2 个办公地点，我想将其用于我的联系页面。而且我想要一个嵌入的谷歌地图来显示这两个位置。在谷歌地图本身，我能够显示两个地图标记。但是，嵌入的 HTML 代码仅使用输入的第一个地址。
Question 1: Is it possible to change the HTML embed code that Google provides to display a map marker for the second location?
问题 1：是否可以更改 Google 提供的 HTML 嵌入代码以显示第二个位置的地图标记？
Question 2 (only if answer to above is "yes"): How?
问题 2（仅当上述答案为“是”时）：如何？
Here is some sample embed code Google gives:
以下是 Google 提供的一些示例嵌入代码：
<iframe width="920" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.ca/maps?hl=en&client=safari&q=33+Victoria+St.,+Toronto,+ON+M5C+3A1&ie=UTF8&hq=&hnear=33+Victoria+St,+Toronto,+Ontario+M5C+3A1&gl=ca&t=m&ll=43.536603,-79.796448&spn=0.696882,2.526855&z=9&iwloc=A&output=embed"></iframe><br /><small><a href="https://maps.google.ca/maps?hl=en&client=safari&q=33+Victoria+St.,+Toronto,+ON+M5C+3A1&ie=UTF8&hq=&hnear=33+Victoria+St,+Toronto,+Ontario+M5C+3A1&gl=ca&t=m&ll=43.536603,-79.796448&spn=0.696882,2.526855&z=9&iwloc=A&source=embed" style="color:#0000FF;text-align:left">View Larger Map</a></small>
回答by Suvi Vignarajah
You can achieve this another way, by using My Places. Here are the steps to achieve this:
您可以使用另一种方式实现这一点My Places。以下是实现这一目标的步骤：
- In Google Maps, notice the
My PlacesButton besideGet Directions- click on that. - Click on
Create a Mapin the Left Panel - Specify a Title and Description (something about your offices maybe), then hit Save.
- Now search for your two locations as you would in the search bar.
- Click on
Save to mapin the bottom of the result listing on the left panel, and specify the map you want to save it to (should be the title you set earlier). - Do that for both locations, then use the Embed tool like you would normally to embed your map.
- 在谷歌地图中，注意
My Places旁边的按钮Get Directions- 点击它。 - 单击
Create a Map左侧面板中的 - 指定标题和描述（可能与您的办公室有关），然后点击保存。
- 现在像在搜索栏中一样搜索您的两个位置。
- 单击
Save to map左侧面板结果列表底部的 ，然后指定要保存到的地图（应该是您之前设置的标题）。 - 对两个位置都执行此操作，然后像通常嵌入地图一样使用嵌入工具。
回答by krikara
I am not sure about the answer to your question, but the Google API is pretty convenient and relatively easy to learn.
我不确定您的问题的答案，但 Google API 非常方便且相对容易学习。
Creating a marker really only needs 3 lines, new marker, position of marker, and the map you are using. Creating a map with multiple markers is relatively short too in JS. Here is a sample.
创建标记实际上只需要 3 条线、新标记、标记位置和您正在使用的地图。在 JS 中创建具有多个标记的地图也相对较短。这是一个示例。
function initialize() {
var myOptions = {
zoom: 4,
center: new google.maps.LatLng(-25.363882, 131.044922),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('map_canvas'),
myOptions);
var marker = new google.maps.Marker({
position: map.getCenter(),
map: map,
});
var marker2 = new google.maps.Marker({
position: new google.maps.LatLng(35, 96),
map: map,
});
}
google.maps.event.addDomListener(window, 'load', initialize);
Using the API will also allow you to further add more features to your map if needed in the future. Eventually, you may want to have the markers display their location and perhaps even get directions to one of the markers. And Google has already written all this code that is available to anyone.
如果将来需要，使用 API 还可以让您进一步向地图添加更多功能。最终，您可能希望让标记显示它们的位置，甚至可能获得到其中一个标记的方向。Google 已经编写了所有这些代码，任何人都可以使用。
Here is a little more advanced example using the fusion tables API, but there are a lot of cool features that you can use besides just markers. https://developers.google.com/fusiontables/docs/samples/infowindow_driving_directions
这是一个使用融合表 API 的更高级示例，但除了标记之外，您还可以使用许多很酷的功能。 https://developers.google.com/fusiontables/docs/samples/infowindow_driving_directions
回答by MymsMan
Try saving your office locations to Google My Maps and then providing the link address of the map in the href of the iframe
尝试将您的办公地点保存到 Google 我的地图，然后在 iframe 的 href 中提供地图的链接地址
