react-leaflet Polyline传有效坐标仍报Invalid LatLng(NaN,NaN)排查

• 报错的直接触发原因是fitBounds方法传入了两个完全重合的边界点：你定义的mapBounds两个坐标值完全一致，Leaflet执行fitBounds时需要基于传入的边界矩形计算投影坐标、适配缩放层级、定位地图中心，宽高为0的零面积边界会导致内部运算出现除零错误，最终生成(NaN, NaN)的非法经纬度对象抛出错误，和Polyline组件本身的逻辑无关。
• 你猜测的「Polyline不支持重叠坐标点」不成立：Leaflet的Polyline原生支持连续重复坐标点，点位重合不会触发这类报错。
• 存在一个隐性的配置问题：setMaxBounds传入的经度范围为-300到300，超出了地理经度的合法范围（-180到180），虽然不是本次报错的直接诱因，但会导致地图拖拽边界校验异常。

• 不要手动写死边界值，直接基于Polyline的点位生成边界，同时加零面积边界兜底逻辑，避免单点场景下的计算错误，参考代码如下：

const map = useMap()
const plottedPoints: LatLong[] = [
  [29.69937, -95.32803],
  [30, 30],
  [29.69937, -95.32803]
]

// 基于折线点位自动生成适配边界
const mapBounds = L.latLngBounds(plottedPoints)
// 兜底处理：如果所有点位重合导致边界零面积，手动扩展小范围缓冲
if (mapBounds.getNorthEast().equals(mapBounds.getSouthWest())) {
  mapBounds.extend([mapBounds.getNorth() + 0.01, mapBounds.getEast() + 0.01])
}
map.fitBounds(mapBounds, {padding: [30, 30]})

map.setMinZoom(2)
// 修正最大边界为合法经纬度范围
map.setMaxBounds([
  [-90, -180],
  [90, 180],
])

• 如果你的使用场景就是定位到单个点位，不需要适配折线范围，直接用setView方法指定中心点和缩放层级即可，完全跳过边界计算逻辑，从根源避免这类错误：

// 单点场景直接设置地图视角
map.setView([29.69937, -95.32803], 15)

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