react-nativehuawei-mobile-serviceshuawei-map-kit

How to add svg as custom icon in HMSMarker (Huawei Maps) - React Native

I want to add an svg as custom icon in HMSMarker from '@hmscore/react-native-hms-map' . Can it be done? Because in the docs it does not mention something about svgs.

I tried two things:

  1. To put a custom view as children in HMSMarker in order to render the svg
  2. To add an svg as icon prop
Solution

  • Unfortunately, as per the documentation of @hmscore/react-native-hms-map, only a limited number of file types are supported for use as markers' icons, including .png, .gif, and .jpg. It seems that SVG files are not supported.

    Therefore, it is not possible to use an SVG as a custom icon for an HMSMarker directly. However, you can convert the SVG file to one of the supported file types and use it as an icon for the marker.

    If you still want to use an SVG file, you can try converting it to PNG or JPG format using a third-party tool or library. You can then use the converted image as an icon for your marker.