反応リーフレット付きのカスタムマーカーアイコン

Question

私はWeb上で見つけたすべてのもの、StackoverflowとGithubを試しましたが、まだそれを作ることはできません。

私はカスタムアイコンとカスタムマーカーを作りたいが、私のコードで私は常にエラーを得たの下：「例外TypeError：options.icon.createIconは関数ではありません」

ここではありません（私のコードですフォルダへのパス上のエラーは、すべてがSRC/JSまたはSRC/IMG）

Icon.js

import L from 'leaflet'; 

const iconPerson = L.Icon.extend({ 
    options: { 
    iconUrl: require('../img/marker-pin-person.svg'), 
    iconRetinaUrl: require('../img/marker-pin-person.svg'), 
    iconAnchor: null, 
    popupAnchor: null, 
    shadowUrl: null, 
    shadowSize: null, 
    shadowAnchor: null, 
    iconSize: new L.Point(60, 75), 
    className: 'leaflet-div-icon' 
    } 
}); 

export { iconPerson }; 

MarkerPinPerson

であります

import React from 'react'; 
import { Marker } from 'react-leaflet'; 
import { iconPerson } from './Icons'; 


export default class MarkerPinPerson extends React.Component { 

    render() { 

    return (
     <Marker 
     position={this.props.markerPosition} 
     icon={ iconPerson } 
     > 
     </Marker> 
    ); 
    } 
} 

本当にあなたの助けを探しています！

Answer 1

私は最終的にIcon.jsファイルの正しいコードが見つかりました：

import L from 'leaflet'; 

const iconPerson = new L.Icon({ 
    iconUrl: require('../img/marker-pin-person.svg'), 
    iconRetinaUrl: require('../img/marker-pin-person.svg'), 
    iconAnchor: null, 
    popupAnchor: null, 
    shadowUrl: null, 
    shadowSize: null, 
    shadowAnchor: null, 
    iconSize: new L.Point(60, 75), 
    className: 'leaflet-div-icon' 
}); 

export { iconPerson };