Google 地图 API 多个标记

2024-02-19

我正在使用以下代码来显示谷歌地图,并在地图上创建一个标记。它运作良好。我只需要在同一张地图上放置多个标记即可。

<!DOCTYPE html>
<html>
<head>
<script
src="http://maps.googleapis.com/maps/api/js?    
key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=false">
</script>

<script>
var myCenter=new google.maps.LatLng(51.508742,-0.120850);

function initialize()
{
var mapProp = {
center:myCenter,
zoom:5,
mapTypeId:google.maps.MapTypeId.ROADMAP
};

var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);

var marker=new google.maps.Marker({
position:myCenter,
});

marker.setMap(map);

var infowindow = new google.maps.InfoWindow({
content:"Hello World!"
});

infowindow.open(map,marker);
}

google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>

<body> 
<div id="googleMap" style="width:500px;height:380px;"></div>
</body>
</html>

任何人都可以帮助我通过使用多个地址在同一张地图上放置多个标记。 谢谢


这是一个基本问题,可以在网上找到几个例子。您基本上需要一个数组来保存各种标记 lat lng。然后使用循环将这些纬度放置在地图上,就像使用一个标记一样。

var berlin = new google.maps.LatLng(52.520816, 13.410186);
var neighborhoods = [
new google.maps.LatLng(52.511467, 13.447179),
new google.maps.LatLng(52.549061, 13.422975),
new google.maps.LatLng(52.497622, 13.396110),
new google.maps.LatLng(52.517683, 13.394393)
];
var markers = [];
var map;

function initialize() {
var mapOptions = {
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: berlin
};
map = new google.maps.Map(document.getElementById('map_canvas'),
mapOptions);
drop();
}

function drop() {
 for (var i = 0; i < neighborhoods.length; i++) 
  {
    markers.push(new google.maps.Marker({
    position: neighborhoods[i],
    map: map,
    }));
  }
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Google 地图 API 多个标记 的相关文章

随机推荐

  • JSON 导入到 Excel

    是否可以在宏中编写 JSON 调用脚本 我想通过 API 连接获取 JSON 字符串 看起来问题是 Excel 期望参数在 HTML 字符串中传递 但 JSON 在 HTML 正文中传递参数 有任何想法吗 由于这是VBA 我会使用COM来调
  • 未为我的带有 Firebase 动态链接的网站设置 UTM 参数

    我需要缩短我的网站网址 我选择 Firebase 动态链接 https firebase google com docs dynamic links https firebase google com docs dynamic links
  • java.lang.ClassCastException,通过 JNDI 查找获取 Entitymanager

    我是 JPA 新手 正在开发一个 web 应用程序 J2EE 其中该 web 应用程序位于 Tomcat 中 所以我无法使用 PersistenceContext 我决定使用 Helper 类 一切都很顺利 然后我决定实现 JNDI 进行连
  • 实施 Izhikevich 神经元模型

    我正在尝试实现 Izhikevich 模型的尖峰神经元 这种类型神经元的公式非常简单 v n 1 0 04 v n 2 5 v n 140 u n I u n 1 a b v n u n 其中 v 是膜电位 u 是恢复变量 If v超过 3
  • ng-repeat 排序在 jQuery 中抛出异常

    我有一个表 其中包含由 ng repeat 创建的行 表头有一个 ng click 用于设置排序谓词 该函数还确定方向 asc desc 排序工作正常 但由于某种原因 每次更改谓词并且排序触发时 我都会收到 jQuery 的异常 这是我正在
  • 从 SFSpeechRecognizer 获取语音幅度

    我正在使用这个库https github com appcoda SpeechToTextDemo https github com appcoda SpeechToTextDemo将语音转录为文本 我想要真实的语音幅度来显示这个库的语音图
  • iOS 9 点播资源可以永久保留吗?

    根据文档 iOS 9 通过 NSBundleResourceRequest 下载的按需资源仅保留到endAccessingResources被调用 并且被自动调用当资源请求对象被释放时 好的 但是当应用程序终止时 一切被解除分配 那么这是否
  • 在 GitHub 上拥有公共存储库的私有分支吗?

    我在 GitHub 存储库中有一个公共 PHP 项目 其中仅包含一个分支 主分支 我想要一个对我来说是私有的单独分支 分支 我已经为私有 GitHub 存储库付费 我希望能够将私人分支 分叉的更改合并到公共存储库 反之亦然 考虑到这一点 我
  • 在delphi 2009中创建gif动画文件?

    gif TgifImage Create gif Width 100 gif Height 100 gif AnimationSpeed 500 gif Animate true gif add image1 Picture Bitmap
  • Laravel:PDO异常,即使安装并测试了驱动程序也找不到驱动程序[重复]

    这个问题在这里已经有答案了 我正在开发一个 Laravel 5 1 项目 该项目必须连接到现有的 MS SQL Server 数据库 我的项目当前位于使用 Apache 2 4 18 的 Ubuntu 16 04 LTS 服务器上 我已在计
  • 什么时候发送HTTP状态码?

    目前 在我的 PHP 脚本中 当用户尝试访问不存在或不属于该用户的内容时 我会将用户重定向到自定义 404 未找到错误页面 就像这样 header Location http www mydomain com error notfound
  • 文件引用与文件?

    我想制作一个 Flash 应用程序 用户可以在其中从本地硬盘驱动器加载文件并将文件保存到本地硬盘驱动器 虽然我经常在 AIR 应用程序中使用File and FileStream类 我以前没有在 SWF 中这样做过 据我所知FileRefe
  • 使用“get”来访问地图有什么好处

    从这个问题跟进 按关键字进行惯用的 clojure 映射查找 https stackoverflow com questions 7034803 idiomatic clojure map lookup by keyword 使用 cloj
  • Spring Rest 和 jQuery Ajax 文件下载

    我目前正在使用 jQuery 和 Spring Rest jQuery 用于向服务器上传和下载文件 上传过程工作正常 但下载文件时没有什么问题 所以场景是 在视图中 用户将选择n个要下载的文件并单击下载按钮 一旦用户单击该按钮 文件就会被下
  • angular.js 选择输入框的过滤类型

    我使用 angular js 的时间很短 有时我有一种感觉 我对 html 和 javascript 一无所知 因为 Angular 在遇到我想象中应该的东西时 可能非常简单 这是我头痛的地方 我的电流控制器scope persons是工厂
  • 为动态加载的新元素添加tinymce

    我的页面包含 5 个 div 可以通过 Tinymce 内联编辑器进行编辑 我可以通过单击按钮 如此动态 来轻松地使用 Jquery 加载 5 个新的 但当然 新的 div 不会受到 Tinymce 的影响 因为 init 已经加载了 我怎
  • 如何在 wpf 中将 List 转换为 ObservableCollection

    我在 wpf 中 有一个通用列表 List 现在我希望将其转换为通用的可观察集合 ObservableCollection 我知道我可以迭代列表并将每个单独的项目添加到 Observable 集合中 然而 在我看来 必须有一种内置的方法来做
  • 如何自定义 JAXB 生成复数方法名称的方式?

    我们使用 JAXB 生成 Java 类 遇到了一些生成的复数方法名称不正确的情况 例如 我们期望的地方getPhysicians我们正在得到getPhysicien 我们如何自定义 JAXB 复数特定方法的方式 架构
  • 如何在SQL Server 2012中解析json数据?

    我正在使用 SQL Server 2012 我被分配了一项任务 其中我的专栏之一 JsonText 的表Sample包含 json 数据 我想通过解析该数据并将其插入到另一个表的列中 Test 我在网上搜索 openjson 在 SQL S
  • Google 地图 API 多个标记

    我正在使用以下代码来显示谷歌地图 并在地图上创建一个标记 它运作良好 我只需要在同一张地图上放置多个标记即可