leaflet - 工具提示在圈子上未始终显示的问题

Question

我正在使用圆圈内的工具提示来显示有关该区域的信息。因此，我将一大堆圆圈映射到地图中

{infos.map((info) => {
   return <infoCircle info={info}/>
})}

然后我有一个函数应该在正确的半径位置和颜色处返回所有带有工具提示的圆圈

import { MapContainer, TileLayer, Marker, Popup, Circle, Tooltip } from 'react-leaflet'
import 'leaflet/dist/leaflet.css';
import {useMemo} from "react";



function infoCircle(input) {
  let info = input.info
  let pathOptions = { color: 'black', fillColor: 'grey' }

  switch (info.type) {
    case 'tourist': pathOptions = { color: 'blue', fillColor: 'blue' }
  }

  return (
    <Circle
      center={notam.location}
      pathOptions={pathOptions}
      radius={info.radius}>
      <Tooltip opacity={1}> {info.info}</Tooltip>
    </Circle>
  )
}

export default infoCircle;

问题是在加载页面时......所有立即显示的圆圈都没有功能工具提示，因此不显示任何东西......但是当我移动地图并尝试查看其他他们有功能提示的圆圈，最终被打破的圆圈的工具提示将再次开始工作......这是某种竞争条件......还是我只是不擅长编程？

标签： leafletreact-leaflet