如何解决如何以编程方式获取 PixiOverlay 标记并通过绘制的边界获取其属性
我正在使用 React PixiOverlay 包装器 (https://github.com/knapcio/react-leaflet-pixi-overlay),它具有在传单地图上按比例绘制标记的出色能力。
虽然这为我提供了一种非常好的方法来有效地绘制数十万个标记,但我不知道如何以编程方式选择这些标记。我希望能够在地图上绘制一个形状并选择该几何图形中的标记。我有绘制形状的能力,但我不知道如何搜索和选择里面的标记。
非常感谢任何帮助。
编辑:对于那些想知道初始渲染是如何完成的,有一个传递的标记数组,PixiOverlay 读取和渲染。颜色、标记类型、坐标等都在这个数组中传递。
import PixiOverlay from 'react-leaflet-pixi-overlay';
import { Map } from 'react-leaflet';
import { renderToString } from 'react-dom/server';
const App = () => {
const markers = [{
id: 'randomStringOrNumber',iconColor: 'red',position: [-37.814,144.96332],popup: renderToString(
<div>All good!</div>
),onClick: () => alert('marker clicked'),tooltip: 'Hey!',},{
id: '2',iconColor: 'blue',popup: 'Quack!',popupOpen: true,// if popup has to be open by default
onClick: () => alert('marker clicked'),tooltip: 'Nice!',}
];
return {
<Map
preferCanvas={true}
maxZoom={20}
minZoom={3}
center={[-37.814,144.96332]}
// Other map props...
>
<TileLayer
url="https://{s}.basemaps.cartocdn.com/rastertiles/voyager/{z}/{x}/{y}{r}.png"
attribution='© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
/>
<PixiOverlay markers={markers} />
</Map>
};
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。