pointToLayer选项更改-腾讯云开发者社区-腾讯云">
我正在学习反应传单,并试图在geojson的每一点上添加圆圈标记。制造商没有在地图上展示。
import React from 'react';
import Tiles from "./Tiles";
import L from 'leaflet'
import 'leaflet/dist/leaflet.css';
import '../css/MapStyle.css'
import Test from "../json/Test.json"
import {GeoJSON, MapContainer} from "react-leaflet";
function App() {
function point(feature, latlng){
return L.circleMarker(latlng);
}
return (
<MapContainer center={[-105.003418922432, 45.75383843460583]} zoom={2} scrollWheelZoom={true}>
<TileLayer
url="https://api.maptiler.com/maps/basic/256/{z}/{x}/{y}.png?key=fXmTwJM642uPLZiwzhA1"
attribution='© <a href="https://www.maptiler.com/">MapTiler</a> © <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
/>
<GeoJSON data={Test} pointToLayer={(a, b)=>{point(a, b)}}/>
</MapContainer>
);
}
export default App;
我还尝试在circleMarker中放置null作为参数。但不起作用。
发布于 2022-08-03 02:26:39
也许您应该添加具有独特价值的键参数。
<GeoJSON key={Date.now()} data={Test} pointToLayer={(a, b)=>{point(a, b)}}/>
发布于 2022-10-13 21:08:05
你的问题与反应无关--传单。箭头函数中缺少return
。因此,实际上没有从函数返回任何值,因此没有任何要呈现的内容。
它应该是
<GeoJSON data={Test} pointToLayer={(a, b)=>{ return point(a, b) }}/>
或者简单地说:
<GeoJSON data={Test} pointToLayer={point}/>
https://stackoverflow.com/questions/73184877
复制