Когда количество маркеров или их размер увеличиваются, пользовательские маркеры не отображаются полностью в React NativeAndroid

Форум для тех, кто программирует под Android
Ответить
Anonymous
 Когда количество маркеров или их размер увеличиваются, пользовательские маркеры не отображаются полностью в React Native

Сообщение Anonymous »

Что я пытаюсь сделать?
Я пытаюсь визуализировать собственный маркер в Android и iOS, используя библиотеку react-native-maps, где количество маркеров может варьироваться от 16 до 900.

Где я застрял?
Когда количество маркеров увеличивается (>60) или увеличивается размер маркера, некоторые маркеры не отображаются полностью в iOS. Однако, если пользователь нажимает на эту область, маркер отображается и становится видимым.
Однако в Android это работает нормально, поэтому я предполагаю, что в iOS есть некоторая проблема с рендерингом.
p>

Как выглядит проблема?
[img]https:// i.sstatic.net/808WS.png[/img]


Формат маркеров:

Код: Выделить всё

markers = {
["key": 0, "latitude": 34.123, "longitude": 134.123],
["key": 1, "latitude": 35.123, "longitude": 135.123],
["key": 2, "latitude": 36.123, "longitude": 136.123],
[],
[]
}
Пример кода:
Примечание. Маркеры извлекаются через API и сохраняются. в штате

Код: Выделить всё

import React from 'react';
import MapView, {PROVIDER_GOOGLE} from 'react-native-maps';

class CustomMap extends React.Component {
constructor(props) {
super(props);

this.state = {
markers: [],
region: {
latitude: 34.334653,
longitude: 134.365288,
latitudeDelta: 0.45,
longitudeDelta: 0.45,
},
};
}

render() {
const {
region,
markers,
} = this.state;

return (


 (this.map = ref)}>
{markers &&
markers.map((marker, index) => (

))}


);
}
}
}
Ниже приведен класс CustomMarker

Код: Выделить всё

import React, {useState} from 'react';
import {Marker} from 'react-native-maps';

const CustomMarker = ({marker}) => {
const [tracksViewChanges, setTracksViewChanges] = useState(true);

return (

;

);
};

const getIcon = marker => {
switch (marker?.id) {
case a:
return require('Assets/Images/img1/a.png');
case b:
return require('Assets/Images/img2/b.png');
case c:
return require('Assets/Images/img3/c.png');
default:
}
};
Я пробовал следующее:-
  • Пытался использовать значок и реквизит изображения Маркерный компонент библиотеки React-native-maps, но проблема осталась той же после того, как количество маркеров увеличилось с 700.
  • Использовалось изображение svg вместо изображения из библиотеки React-native.
  • При использовании маркера по умолчанию маркеры отображаются правильно как в iOS, так и в Android.
  • Использована ссылка в компоненте маркера, чтобы установить для TrackViewChange значение false. Ссылка


Подробнее здесь: https://stackoverflow.com/questions/756 ... -render-co
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Android»