【发布时间】:2021-02-01 21:43:39
【问题描述】:
在 figuring out 如何处理 TypeScript 和 use-supercluster 库之后,我已经“让它工作”了,直到我遇到一个新问题:每当我使用 useSuperCluster() 函数时,我都会得到一个空数组。
我正在关注creator's guide,所以我可以处理我自己的项目。
这就是我的工作:
const [bounds, setBounds] = useState(undefined as BBox | undefined);
const { data, error } = useSwr(API_URL, fetcher);
const coords: Array<ParkingData> = data && !error ? data.data : [];
const points: Array<PointFeature<GeoJsonProperties>> = coords.map(pd => ({
type: "Feature",
properties: {
cluster: false,
pdId: pd._id,
category: 'test'
},
geometry: { type: "Point", coordinates: [ pd.lat, pd.lng ] }
}));
const { clusters } = useSuperCluster({
points,
bounds,
zoom,
options: { radius: 75, maxZoom: 25 }
});
当我调试 points 时,我得到类似的东西:
但是,clusters 是空的。我用onChange 属性更新了视频中的bounds,比如:
onChange={({ zoom, bounds }) => {
setZoom(zoom);
setBounds([
bounds.nw.lng,
bounds.se.lat,
bounds.se.lng,
bounds.nw.lat
]);
}}
那么,我做错了什么?
编辑:
我已将supercluster 对象添加到useSuperCluster() 解构,如const { clusters, supercluster } = useSuperCluster(...),调试后我得到以下对象:
【问题讨论】:
-
对于那些投反对票的人,发表评论会很棒,这样我就可以了解发生了什么......
标签: javascript reactjs typescript google-maps google-map-react