jquery里地图添加标记
时间: 2023-07-31 13:09:49 浏览: 40
在 jQuery 中添加地图标记的方法取决于您使用的地图 API。以下是使用 Google 地图 API 添加标记的示例代码:
首先,确保在 HTML 中将 Google 地图 API 引入:
```html
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" async defer></script>
```
其中,`YOUR_API_KEY` 是您的 Google 地图 API 的密钥。`initMap` 函数是在 API 加载完成后自动调用的。
然后,在 JavaScript 文件中创建 `initMap` 函数来初始化地图:
```javascript
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
center: {lat: 37.7749, lng: -122.4194},
zoom: 8
});
}
```
其中,`map` 是地图对象,`#map` 是 HTML 中地图容器的 ID。`center` 是地图的中心坐标,`zoom` 是地图的缩放等级。
接下来,可以使用 `google.maps.Marker` 类在地图上添加标记:
```javascript
function initMap() {
var myLatLng = {lat: 37.7749, lng: -122.4194};
var map = new google.maps.Map(document.getElementById('map'), {
center: myLatLng,
zoom: 8
});
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
title: 'Hello World!'
});
}
```
其中,`myLatLng` 是标记的坐标,`map` 是地图对象,`title` 是标记的鼠标悬停提示文本。
以上就是使用 jQuery 在 Google 地图上添加标记的简单示例。如果您使用其他地图 API,代码可能会有所不同,但基本原理是相同的。