@geoscene/geoscene-leaflet-cluster
v3.0.2
Published
GeoScene Leaflet plugin for visualizing Feature Layers as clusters with L.markercluster.
Downloads
9
Readme
GeoScene Leaflet Cluster
启用可视化 GeoScene Feature Services 聚合功能可以使用 L.MarkerCluster Leaflet 插件.
例如
这里有一个简单的示例让你快速开始。只需更改路径以指向适当的库
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>GeoScene Leaflet Debugging Sample</title>
<meta
name="viewport"
content="initial-scale=1,maximum-scale=1,user-scalable=no"
/>
<!-- load leaflet from node_modules -->
<link rel="stylesheet" href="../node_modules/leaflet/dist/leaflet.css" />
<script src="../node_modules/leaflet/dist/leaflet-src.js"></script>
<!-- load leaflet.markercluster from node_modules -->
<script src="../node_modules/leaflet.markercluster/dist/leaflet.markercluster-src.js"></script>
<link
rel="stylesheet"
href="../node_modules/leaflet.markercluster/dist/MarkerCluster.css"
/>
<link
rel="stylesheet"
href="../node_modules/leaflet.markercluster/dist/MarkerCluster.Default.css"
/>
<!-- load esri leaflet from node_modules -->
<script src="../node_modules/@geoscene/leaflet/dist/geoscene-leaflet.js"></script>
<!-- load clustered feature layer source for debugging -->
<script src="../dist/geoscene-leaflet-cluster-debug.js"></script>
<style>
body {
margin: 0;
padding: 0;
}
#map {
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
}
#info-pane {
position: absolute;
top: 10px;
right: 10px;
z-index: 400;
padding: 1em;
background: white;
}
</style>
</head>
<body>
<div id="map"></div>
<div id="info-pane" class="leaflet-bar">
<label> sample application for debugging </label>
</div>
<script>
/*
make a copy of this file in the same folder if you'd like git to ignore your local changes
*/
var map = L.map("map").setView([45.526, -122.667], 6);
L.geoscene.basemapLayer("tianditu-vector").addTo(map);
L.geoscene.basemapLayer("tianditu-vector-annotion").addTo(map);
var clusterLayer = L.geoscene.Cluster.featureLayer({
url: "https://sampleserver6.arcgisonline.com/arcgis/rest/services/USA/MapServer/0",
}).addTo(map);
clusterLayer.bindPopup(function (layer) {
return L.Util.template("<p>{areaname}</p>", layer.feature.properties);
});
</script>
</body>
</html>资源
GeoScene Maps SDK for JavaScript Leaflet L.MarkerCluster
许可
易智瑞信息技术有限公司版权所有 © 2023 并保留所有权利。发行于中华人民共和国。
本材料在 GeoScene 主许可协议（MLA）下许可使用，并受该协议条款的约束。 只要遵守主许可协议中的条款并包括此版权声明，您即可在不进行修改的情况下 重新分发和使用这些代码。
查看 https://links.geoscene.cn/legal/GeoScene_EULA.pdf 了解使用限制