Я пытаюсь добиться наличия маркеров на карте CRS (в частности, кругового аватара с инициалами), которые масштабируются с масштабом карты (они будут казаться больше или меньше в зависимости от масштаба, но не останутся одинаковыми по размеру), и были значительные трудности с достижением производительности.
Я пробовал два разных компонента для аватаров, (все еще не уверен, какое решение является правильным):
- Компонент Circle с простой постоянной подсказкой внутри (этот компонент удобен, поскольку он автоматически масштабируется).
- Маркер с переданным ему
divIcon
, который я стилизовал для круга, используя border-radius. На этот раз мне нужно настроить iconSize
с каждым уровнем масштабирования, что подводит меня к следующей проблеме:
Проблема с наклейкой заключается в том, как получить контекст текущего состояния масштабирования:
- Использование события
Map
onzoomanim:
на карте, чтобы захватить масштаб и передать его аватарам
- Это приводит к значительному отставанию между временами рендеринга каждого слоя (например, плитки, оверлея, всплывающей подсказки) - и это плохой UX
- Используйте
withLeaflet
HOC, чтобы получить контекст Leaflet.
- Несмотря на то, что зум глубоко вложен в
leaflet
опору, компонент не обновляется при изменении зума.
Есть ли еще что-то, что мне не хватает в Leaflet / React Leaflet, которое может достичь желаемого результата?