Я использую react-native-maps
исключительно для своего приложения.У меня много логики внутри карты.Есть маркеры, тепловые карты (с использованием пакета react-native-heatmaps
), а также полигоны (с использованием пакета react-native-maps-directions
).
Сегодня я хотел провести рефакторинг своего компонента Map, поэтому я разбил функциональность на 2 части - точкии Roads мой MapView имел следующую структуру перед рефакторингом
<MapView>
<Heatmap {Some props here} />
{some function that will render a couple of Markers}
{some function that will render a cople of MapViewDirections}
</MapView>
Это раньше работало как для Android, так и для iOS.
После рефакторинга он начал выглядеть так:
<MapView>
<MyPointsComponent />
<MyRoadsComponent />
</MapView>
В Android это будет работать так же, как и раньше, однако в iOS оно ничего не отобразит на карте.
Затем я протестировал наименьший возможный пример:
<MapView>
<View>
<Marker coordinates={{somecoordinates}} />
</View>
</MapView>
Это работает как на iOS, так и на Android
<MapView>
<MyComponentThatReturnsAMArker />
</MapView>
Это работает как на iOS, так и на Android, независимо от того, откуда загружены маркеры.
<MapView>
<View>
<MyComponentThatReturnsAMArker />
</View>
</MapView>
Это работает на iOS и Android, еслимаркеры являются локальными - заполняются с момента начальной загрузки карты.
Это не работает для iOS, но работает на Android, если маркеры загружаются динамически из серверной части.После заполнения (не при начальной загрузке)
Я ищу любые решения в обоих направлениях:
- Обходной путь, чтобы заставить его работать, потому что я не хочу отказываться отрефакторинг
- У меня есть разветвленная библиотека карт, так что, возможно, я мог бы изменить ее для работы в этом сценарии (у меня уже есть изменения, связанные с тем, что она не поддерживает тепловые карты из коробки) здесь
PS Я использую провайдер Google Maps на iOS из-за тепловых карт и не могу отказаться от него.