React-Leaflet rotate icon

Question

내 오래된 전단지 응용 프로그램에서 나는 this code을 사용하여 아이콘을 회전 시켰고 완벽하게 작동했습니다. 이제 코드를 반응 전단지로 옮기려고하지만이를 적용하는 방법을 알 수 없습니다. 사용자 정의 컴포넌트를 통해 가능해야한다는 것을 알고, RotatedMarker (src의 Marker.js 기반)에서 어떤 종류의 클래스를 만들려고했으나, 새로운 기능으로 작동하지 못했습니다. 누구든지 올바른 방향으로 나를 가리킬 수 있습니까?

감사합니다,

알렉스

Answer 1

좋아. 이것이 내가 작동하도록 한 것입니다. 이 방법으로 수행해야하는지 확실하지 않지만 작동하는 것 같습니다. https://github.com/verdie-g/react-leaflet-rotatedmarker

import RotatedMarker from 'react-leaflet-rotatedmarker' 

<RotatedMarker position={position} rotationAngle={180} rotationOrigin={'center'} /> 

:

export default class RotatedMarker extends Marker { 

    componentDidMount() { 

     super.componentDidMount(); 
     this.leafletElement.setIconAngle(this.props.rotation); 
    } 


    componentWillUpdate(nextProps, nextState) { 
     if (nextProps.rotation) { 
      this.leafletElement.setIconAngle(nextProps.rotation); 
     } 
    } 
} 

Answer 2

나는 bbecquet의 전단지의 반응 래퍼 마커를 회전했다