Closed sokolirasaha11 closed 2 years ago
В примере выше дважды прописан эффект для rotate. Судя по коду с этим проблем быть не должно
Для перемещения маркера нужно использовать animatedMoveTo
. При этом важно не изменять положение маркера, которое передается через пропсы - иначе маркер перерендерится с новыми координатами и поэтому происходят рывки
Код для вашей задачи будет примерно таким:
function MyMarker(props) {
const { rotate, coords, ...p } = props;
const initialCoords = useRef({...coords});
const marker = useRef();
useEffect(() => {
if (marker.current) {
marker.current.animatedRotateTo(rotate, 10);
}
}, [rotate])
const points = useRef();
useEffect(() => {
if (marker.current) {
marker.current.animatedMoveTo(coords, 10);
}
}, [coords])
return <Marker ref={marker} {...p} coords={initialCoords} />
}
Супер! Спасибо большое!
@ownikss Добрый вечер, у меня все таки не получился использовать данный метод она не работает у меня
Сделал компонент CarMarker
import React, {useEffect, useRef} from 'react';
import {Marker} from 'react-native-yamap';
export default function CarMarker(props) {
const {rotate, ...p} = props;
const marker = useRef(null);
useEffect(() => {
if (marker.current) {
marker.current.animatedRotateTo(rotate, 10);
}
}, [rotate]);
return <Marker ref={marker} {...p} />;
}
Использую его так
<YaMap
initialRegion={{
lat: 55.755864,
lon: 37.617698,
zoom: 12,
}}
style={styles.mapContainer}>
{cars.length > 0 &&
cars.map(car => {
return (
<CarMarker
source={carIcon}
key={car.id}
scale={0.3}
onPress={e => {
console.log(car);
}}
rotate={car.last_position.direction}
point={{lat: car.last_position.lat, lon: car.last_position.lng}}
visible={isShowCar}
/>
);
})}
</YaMap>
Что не так делаю?
Добрый день, не понимаю как докрутить анимацию на маркер. Нужно что бы маркер двигался по разным координатам, но это получается рывками. Помимо этого всего, сейчас я использую для маркера функцию, которая позволяет нам менять его направление (rotate)
Есть варианты докинуть анимацию на маркер? Возможно это проще чем кажется, но я пока не могу этого сделать.