<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>百度地图API示例</title> <script src="https://api.map.baidu.com/api?v=3.0&ak=pEK3fvYubMpfzegFaDOYzyf24WXb99uK"></script> </head> <body> <div id="map" style="width: 100%; height: 750px;"> </div> <script> // 初始化地图对象 var map = new BMap.Map("map"); // 设置地图中心点和缩放级别 var point = new BMap.Point(118.58479, 24.942056); map.centerAndZoom(point, 15); // 添加标记 var marker = new BMap.Marker(point); map.addOverlay(marker); </script> </body> </html>我想在地图上标记自定义的内容怎么补充
时间: 2023-12-02 15:05:18 浏览: 47
您可以使用BMap.Label类来标记自定义内容,该类用于在地图上添加文本标签。下面是一个示例代码,可以在地图上添加自定义标签:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>百度地图API示例</title>
<script src="https://api.map.baidu.com/api?v=3.0&ak=pEK3fvYubMpfzegFaDOYzyf24WXb99uK"></script>
</head>
<body>
<div id="map" style="width: 100%; height: 750px;"></div>
<script>
// 初始化地图对象
var map = new BMap.Map("map");
// 设置地图中心点和缩放级别
var point = new BMap.Point(118.58479, 24.942056);
map.centerAndZoom(point, 15);
// 添加标记
var marker = new BMap.Marker(point);
map.addOverlay(marker);
// 创建标签对象
var label = new BMap.Label("这是自定义标签的内容", {offset:new BMap.Size(20,-10)});
// 设置标签样式
label.setStyle({
color : "red",
fontSize : "12px",
height : "20px",
lineHeight : "20px",
fontFamily:"微软雅黑"
});
// 添加标签
marker.setLabel(label);
</script>
</body>
</html>
```
在这个示例代码中,我们首先创建了一个BMap.Label对象,在初始化时传入了标签的内容和偏移量。接着,我们设置了标签的样式,包括颜色、字体大小、高度、行高和字体等。最后,我们将标签添加到标记上,通过marker.setLabel(label)实现。您可以根据需要,自定义标签的内容和样式。