React-Leaflet: Scale markers after zooming

问题

I'm trying to achieve having markers on a CRS map (specifically a circular avatar with initials) that scale with the map's zoom (they would appear larger or smaller depending on the zoom, not remain the same size), and have been having considerable difficulty achieving performance.

I've tried two different components for the avatars, (still not sure which is right solution):

• Circle component with a simple, permanent tooltip inside (this component is convenient because it automatically scales).
• Marker with a divIcon passed to it, that I styled to a circle using a border-radius. This one I have to adjust iconSize with each zoom level, which brings me to my next issue:

The sticker problem is how get the context of the current zoom state:

• Using the Map onzoomanim: event on the map to grab the zoom and pass it to the avatars
  • This results in considerable lag between the times each layer renders (e.g. tile, overlay, tooltip) — and is a bad UX
• Use withLeaflet HOC to grab the Leaflet context.
  • Though the zoom is deeply nested in the leaflet prop, the component is not updating on a zoom change.

Is there something else is Leaflet/React Leaflet that I'm missing that can achieve the desired result?

来源：https://stackoverflow.com/questions/55203246/react-leaflet-scale-markers-after-zooming