如何修改Google Maps API Drawing Manager的默认绘图光标样式

利用CSS高优先级覆盖Google Maps自动生成的内联样式，无需额外JS逻辑：

/* 精准匹配绘图模式下的十字光标专属容器 */
.gm-style > div[style*="crosshair.cur"],
.gm-style > div[style*="z-index: 2000000000"] {
  /* 替换为你的铅笔光标资源地址，后面加备用光标避免加载失败 */
  cursor: url(你的铅笔光标文件地址), pointer !important;
}

只要绘图模式激活，Google Maps插入的光标容器就会命中该规则，自动替换为自定义光标。

如果遇到Google Maps版本更新导致CSS选择器失效，可以通过监听绘图模式切换事件，动态修改对应DOM的样式：

// 给绘图管理器绑定模式切换监听事件
google.maps.event.addListener(drawingManager, 'drawingMode_changed', () => {
  // 仅当进入绘图状态时执行修改
  if (drawingManager.getDrawingMode() !== null) {
    // 获取地图容器DOM
    const mapContainer = _map.getDiv();
    // 查找高z-index的光标容器
    const cursorEl = mapContainer.querySelector('div[style*="z-index: 2000000000"]');
    if (cursorEl) {
      cursorEl.style.cursor = 'url(你的铅笔光标文件地址), pointer';
    }
  }
});

注意：自定义光标建议使用32*32px以内的cur/png格式文件，避免部分浏览器无法识别加载失败。

内容的提问来源于stack exchange，提问作者user1871040