Leaflet 反应传单标记组件中图标的路径

我正在使用react传单库。
渲染标记后，我得到一个错误，即没有文件

我曾试图手动将该文件放入创建标记的组件的根文件夹中，但随后出现致命错误

类型错误：options.icon.createIcon不是函数

下面是整个组件代码

import React, { Component } from 'react';
import { Marker, Tooltip, Polygon } from 'react-leaflet';
import L from 'leaflet';
import './style.css';
import icon from './marker.svg';

/**
 * @class ./widgets/SeatMap/components/LeafletMap/components/CategoryControl/components/ShapeLayer
 */
class ShapeLayer extends Component
{
    /**
     * @type {object}
     */
    shapes = {};

    /**
     * Constructor.
     *
     * @param {object} props
     */
    constructor (props)
    {
        super(props);
        this.shapes = props.shapes;
    }

    /**
     * @returns {XML}
     */
    render() {
        return (
            <div className={'ShapeLayer'}>

                {
                    this.shapes['texts'].map(text => {
                        return (
                            <Marker key={text['id']} position={text['coordinates']} draggable={false} opacity={0.01} icon={icon}>
                                <Tooltip direction={"center"} permanent className={'shape-tooltip'}>
                                    <span>{text['text']}</span>
                                </Tooltip>
                            </Marker>
                        );
                    })
                }

                {
                    this.shapes['polygons'].map(polygon => {
                        return (
                            <Polygon key={polygon['id']} positions={polygon['coordinates']} fillColor={"white"} color={'gray'} />
                        );
                    })
                }
            </div>
        )
    }
}

export default ShapeLayer;

import React，{Component}来自'React'；
从“反应传单”导入{标记、工具提示、多边形}；
从“传单”进口L；
导入“/style.css”；
从“/marker.svg”导入图标；
/**
*@class./widgets/SeatMap/components/传单地图/components/CategoryControl/components/ShapeLayer
*/
类ShapeLayer扩展组件
{
/**
*@type{object}
*/
形状={}；
/**
*构造器。
*
*@param{object}props
*/
建造师（道具）
{
超级（道具）；
this.shapes=props.shapes；
}
/**
*@returns{XML}
*/
render（）{
返回(
{
此.shapes['text'].map（text=>{
返回(
{text['text']}
);
})
}
{
这个.shapes['polygons'].map（polygon=>{
返回(
);
})
}
)
}
}
导出默认ShapeLayer；

---

如何解决此问题？

您好，您不能直接使用这样的图标。 React传单是传单的“抽象”，因此它使用相同的功能。 要创建自定义图标，必须创建divIcon。 要了解一个真实的示例，请访问：