如何在 @react-google-maps/api 中添加自定义 ico 或 SVG 作为标记图标

Question

我正在使用@react-google-maps/api在我的 React Web 应用程序中显示 Google 地图。根据他们的文档，我添加了标记，如下所示。

        <Marker
            onLoad={onLoad}
            position={location}
            
            icon={{
                // path: google.maps.SymbolPath.CIRCLE,
                url:'./../../assets/svg/location_marker.svg',
                scale: 7,
            }}
        />

但它似乎不起作用。没有显示任何标记。使用google.maps.SymbolPath.CIRCLEaspath将显示标记图标。以前有人遇到过这个问题吗？有任何想法吗？

Answer 1

添加了要求并解决了问题。

    <Marker
        onLoad={onLoad}
        position={deliveryDestination}
        icon={{
            // path: google.maps.SymbolPath.CIRCLE,
            url: (require('./../../assets/svg/location_marker.ico')),
            fillColor: '#EB00FF',
            scale: 7,
        }}
    />