高德地图标注信息，标注信息居中怎么处理，给一个demo

如果您要在高德地图上标注信息并使其居中，可以使用marker的`offset`属性来实现。

示例代码如下：

var marker = new AMap.Marker({
  position: [116.397428, 39.90923],
  offset: new AMap.Pixel(-13, -30), // 设置偏移量，使标注点居中
  content: '<div>标注信息</div>' // 自定义标注信息内容
});

在上述代码中，`offset`属性的值是一个`AMap.Pixel`对象，它的第一个参数表示水平方向的偏移量，第二个参数表示垂直方向的偏移量。为了使标注点居中，我们可以将水平方向上的偏移量设置为标注信息的宽度的一半负数，垂直方向上的偏移量设置为标注信息的高度的一半负数。

需要注意的是，`content`属性是用来设置标注信息的内容的，可以是一个html字符串，也可以是一个dom元素。在上述代码中，我们使用了一个`<div>`元素来作为标注信息的内容。

希望这个demo对您有所帮助！

相关问题

高德地图标注信息，标注信息和图标居中怎么处理，给一个demo

以下是一个简单的 demo，使用了 JavaScript 和 CSS 来实现高德地图标注信息和图标的居中显示：

HTML 代码：

<div id="map"></div>

<div class="marker">
  <img src="https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png" />
  <div class="info">这是一个标注信息</div>
</div>

CSS 代码：

#map {
  height: 400px;
}

.marker {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.marker img {
  display: block;
  margin: 0 auto;
}

.marker .info {
  margin-top: 10px;
}

JavaScript 代码：

// 初始化地图
var map = new AMap.Map('map', {
  zoom: 14,
  center: [116.397428, 39.90923]
});

// 添加标注
var marker = new AMap.Marker({
  position: [116.397428, 39.90923],
  map: map
});

// 绑定标注信息窗口
var infoWindow = new AMap.InfoWindow({
  content: '<div class="marker"><img src="https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png" /><div class="info">这是一个标注信息</div></div>',
  offset: new AMap.Pixel(0, -36)
});
marker.on('click', function() {
  infoWindow.open(map, marker.getPosition());
});

在这个 demo 中，我们使用 CSS 中的 `transform` 属性来实现标注和图标的居中显示，同时使用 `text-align` 属性来实现标注信息的居中显示。此外，我们还使用了 AMap.InfoWindow 类来实现标注信息窗口的显示，并使用了 `offset` 属性来调整窗口的位置。