个人技术分享

(谷歌地图版本V3)

  var contentString = "<div class='devinfo'><P>设备ID: BJ-20240507</p> <P>设备状态: 正常</p> <P>通讯信号: 89% </p> <P>设备位置: 中国</p> <P>剂量率: 988</p></div>"
   // 信息弹窗显示的内容
  var infowindows = new google.maps.InfoWindow({
    content: contentString
  });
  let images =
    "./res/airplane---.png"; // 图标的 img 地址
  const marker = new google.maps.Marker({
    position: { lat: 39.617967, lng: 116.324860 },
    // 116.324860,39.617967
    map, // 实例化地图
    icon: images,
    draggable:true, // 标记可拖拽
    title: '无人机'
  });

  marker.addListener("click", () => {
    // 标记点击事件
    infowindows.open(map, marker);
  });

实际地图效果如图所示
在这里插入图片描述