3
我正在嘗試使用由uber team for mapbox gl編寫的反應友好包裝器。從GeoJSON繪製多邊形在react-mapbox-gl
我想知道是否有人已經成功地從geojson源渲染多邊形特徵與他們的API。它指出一個源選項是屬性可在<Layer/>
組件:
sourceOptions:調用GeoJSONSource方法
時繼mapbox API爲geoJsonSource Options對象合併使用的對象,我我正在嘗試以下方法並想知道我還需要做些什麼才能使其呈現:
import React, { Component } from 'react';
import ReactMapboxGl, { Layer, Feature } from "../node_modules/react-mapbox-gl/dist";
import logo from './logo.svg';
import './App.css';
let containerStyle = {
height: "100vh",
width: "100vw"
};
const accessToken = _removed for safety_
class App extends Component {
_polygonClicked = ({ feature }) => {
console.log("Polygon clicked", feature.geometry.coordinates);
};
render() {
return (
<div className="App">
<div className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<h2>Welcome to React</h2>
</div>
<ReactMapboxGl
style={"mapbox://styles/mapbox/streets-v8"}
center={[11.956511272000057,10.095463399000039]}
zoom={[11]}
accessToken={accessToken}
containerStyle={containerStyle}>
<Layer
type="fill"
paint={{ "fill-color": "#3bb2d0", "fill-opacity": .5 }}
id="testing"
sourceOptions={'religious',{
"type": 'geojson',
"data":'../small_poly/bridges.geojson'
}}
sourceId={'religious'}>
</Layer>
</ReactMapboxGl>
</div>
);
}
}
export default App;