设置direction:center后Leaflet Tooltip仍未居中的问题求助

• 直接给多边形绑定Tooltip（推荐方案）
  没必要绕Marker这一步，直接给Polygon绑定Tooltip，Leaflet会自动以多边形的边界中心作为Tooltip的定位基准，自然就能居中显示：

  polygon.bindTooltip('County Name', {
    permanent: true,
    direction: 'center'
  }).addTo(mymap);
  

  这种方式不用处理标记点，Tooltip直接关联多边形，定位精准还省代码。

• 非要用Marker？试试这两种修正方法
  原代码里Tooltip偏右，是因为Marker默认带图标偏移，哪怕设opacity:0，图标占位还是会干扰Tooltip的定位逻辑。可以这么改：

  1. 用空图标消除Marker占位影响
     创建一个无尺寸的空图标，彻底去掉默认图标的偏移：

     const emptyIcon = L.divIcon({
       className: 'empty-icon',
       html: '',
       iconSize: [0, 0],
       iconAnchor: [0, 0]
     });
     
     L.marker(polygon.getBounds().getCenter(), {icon: emptyIcon})
       .bindTooltip('County Name', {
         permanent: true,
         direction: 'center'
       })
       .addTo(mymap);
     

  2. 用CSS强制Tooltip居中
     给Tooltip加个自定义类，通过CSS调整定位，把偏移拉回来：

     L.marker(polygon.getBounds().getCenter())
       .bindTooltip('County Name', {
         permanent: true,
         direction: 'center',
         className: 'centered-tooltip'
       })
       .addTo(mymap);
     

     对应的CSS代码：

     .centered-tooltip {
       left: 50% !important;
       transform: translateX(-50%) !important;
     }
     

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