javascript - MapBox GL SymbolLayer for React native

问题描述

我试图用 SymbolLayer 标记一个特定的坐标，但我找不到任何特定于 React Native 的文档/示例。

  return (
    <MapboxGL.MapView
      style={styles.map}
      logoEnabled={false}
      localizeLabels={true}>
      <MapboxGL.Camera
        zoomLevel={15}
        animationMode={'flyTo'}
        animationDuration={2000}
        centerCoordinate={coordinates}
      />
      <AddressTextBox placeName={placeName}/>
      <MapboxGL.SymbolLayer></MapboxGL.SymbolLayer>
    </MapboxGL.MapView>
  );

https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#symbol

https://github.com/nitaliano/react-native-mapbox-gl/blob/master/docs/SymbolLayer.md

我只发现了这个。由于我没有使用任何其他层，因此我应该将哪些属性传递给我的组件？如何准确传递我希望标记的坐标？

我尝试传递point={}并symbolPlacement进入它，但它给出了一个重载错误，因为它不存在点属性。这是我从文档中了解到的。

标签： javascriptreact-nativemapboxmapbox-gl-jsmapbox-gl

如果你只需要标记一个坐标，而不是 SymbolLayer，你可以使用 MapboxGL.MarkerView。您可以在其中创建一个视图，并在其中MarkerView添加您想要的任何徽标/文本。它应该适用于iOS和android。这是一个例子：

https://medium.com/javascript-in-plain-english/mark-a-coordinate-on-mapbox-map-in-react-native-5d21c71ed46e

javascript - MapBox GL SymbolLayer for React native

问题描述

解决方案

推荐阅读