<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>Google Maps Multiple Markers</title>
<script src="http://maps.google.com/maps/api/js?sensor=false"
type="text/javascript"></script>
</head>
<body>
<div id="map" style="width: 500px; height: 400px;"></div>
<script type="text/javascript">
var locations = [
['Bondi Beach', -33.890542, 151.274856, 4],
['Coogee Beach', -33.923036, 151.259052, 5],
['Cronulla Beach', -34.028249, 151.157507, 3],
['Manly Beach', -33.80010128657071, 151.28747820854187, 2],
['Maroubra Beach', -33.950198, 151.259302, 1]
];
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 10,
center: new google.maps.LatLng(-33.92, 151.25),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
</script>
</body>
</html>
分享到：
相关推荐
**Google Maps JavaScript API V3中文版参考手册** Google Maps JavaScript API V3是Google提供的一套用于在网页上集成和操作地图的JavaScript库。这个API允许开发者利用JavaScript编程语言，为网站构建高度定制化...
Google Maps API V3 中文参考文档（JavaScript） Google Maps API V3 是 Google Maps 提供的一款强大的地图应用程序接口，允许开发者在网站或应用程序中轻松嵌入谷歌地图。该 API 的 JavaScript 版本提供了丰富的...
《Google Maps JavaScript API V3 详细教程》 Google Maps JavaScript API V3 是一款强大的工具，允许开发者在网页中集成互动式地图，为用户提供丰富的地理位置体验。API 的第三版相较于第二版进行了更新和优化，...
### Google Maps JavaScript API V3中文版参考手册 #### 概述 Google Maps JavaScript API V3 是一款强大的工具，允许开发者在网页上嵌入并自定义谷歌地图。此API提供了丰富的功能，包括创建交互式地图、添加标记、...
使用vue2-water-marker组件实现水印预览
Google Maps JavaScript API V3 是一个强大的工具，允许开发者在网页上集成交互式地图。这个API提供了丰富的功能，包括创建和自定义地图、添加各种控件、叠加层、服务以及地图类型，以满足不同应用场景的需求。 1. ...
js结构如下： -js |- GMap |- GoogleMapsApi.js - google maps api class |- marker.tmpl.js - custom marker template |- stylers.js - JSON styles and custom icon |- index.js - functions to render map, ...
总之，"google-maps-marker-with-label-v3"是一个非常实用的JavaScript库，它为Google Maps API V3增加了标记标签功能，使地图信息的展示更加直观和丰富。对于那些需要在地图上清晰地标注特定位置的应用来说，这是一...
"google-maps-javascript-v3-api-wrapper" 是一个专为简化此API使用而设计的包装器库，它为开发者提供了更简洁、更易操作的接口，从而让开发地图应用变得更加高效和便捷。 1. **API包装器的作用** - **代码简化**...
该插件的实现原理可能涉及到Atom编辑器的API接口，通过监听用户的滚动行为，动态更新滚动条上的标记。开发者可以根据个人需求自定义标记的样式，比如颜色、形状和出现的位置，以适应不同的工作习惯和视觉偏好。此外...
Google Maps JavaScript API V3 是 Google 提供的一个强大工具，用于在网页上集成交互式的地图服务。作为正式的 JavaScript API 版本，它允许开发者利用 HTML、CSS 和 JavaScript 技术创建丰富的地图应用程序，提供...
该组件是与一些伟大的想法在谷歌地图V3覆盖代码示例改编从这个。 /！\ 重要的提示 该项目最初是的插件。 现在，该项目似乎不再受维护，并且已开始维护已维护的。由于这是一个派生，因此该插件应该看起来像在工作。 ...
一、Google Maps JavaScript API V3 谷歌地图 Google Map API V3 是一个基于 JavaScript 的 API，允许开发者在自己的网站或应用程序中嵌入谷歌地图。该 API 提供了一个强大的地图引擎，支持多种类型的地图、标记、...
为了解决这一问题，Google Maps v3提供了一个名为"Marker Clusterer"的工具，即"google-maps-marker-clusterer-v3"。这个库通过智能地将相近的标记聚合在一起，形成一个“群集”来提升地图的可读性和性能。 一、...
Google Maps JavaScript API V3 是一个强大的工具，允许开发者在网页上集成谷歌地图的功能，提供丰富的交互式地图体验。这个API版本带来了许多改进和新特性，使得开发更加高效和灵活。以下是对主要知识点的详细说明...
"v3-utility-library-master" 是一个开源项目，专门针对Google Maps JavaScript API V3构建的实用工具库。这个库提供了一系列的功能和扩展，使得开发者在使用Google Maps API时能够更轻松地实现各种复杂的地图功能。...
Leaflet Maps Marker是一款在Web地图开发中广泛使用的JavaScript库，它为Leaflet地图框架提供了强大的图标、标记和图层管理功能。该插件使得用户能够轻松地在地图上添加自定义标记，设置多个图层，并且支持交互式...
谷歌地图API V3（Google Maps API V3）是谷歌提供的一套强大的工具和服务集合，旨在帮助开发者在网页上集成交互式地图。它支持多种功能，如自定义地图样式、添加标记、路线规划等。本篇文章将详细介绍API的各个组成...
The most recent Google Maps API for Adobe Flash is the map_1_9a.swc and for Adobe Flex or Adobe Air it is the map_flex_1_9a.swc one. It fixes two bugs: Geocoding and Directions fail if swf is hosted ...
总的来说，"js-maps-marker"项目结合了JavaScript、Google Maps API、HTML和可能的CSS技术，提供了一种个性化的方式来展示用户旅行或生活经历的地理分布，同时也展示了如何利用这些技术进行地图开发和数据可视化。...