huanld/pygeoapi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Render covjson and geojson in EDR HTML view (#1749)

Browse Source
This commit is contained in:
Benjamin Webb
2024-07-22 18:06:23 -04:00
committed by GitHub
parent 31480af845
commit bbb5035508
1 changed files with 28 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pygeoapi/templates/collections/edr/query.html
+28
View File
@@ -14,9 +14,15 @@
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css"/>
<link rel="stylesheet" type="text/css" href="https://unpkg.com/leaflet-coverage@0.7/leaflet-coverage.css">
<script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet.js"></script>
{% if data.type == "Coverage" or data.type == "CoverageCollection" %}
<script src="https://unpkg.com/covutils@0.6/covutils.min.js"></script>
<script src="https://unpkg.com/covjson-reader@0.16/covjson-reader.src.js"></script>
<script src="https://unpkg.com/leaflet-coverage@0.7/leaflet-coverage.min.js"></script>
{% elif data.type == "Feature" or data.type == "FeatureCollection" %}
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster/dist/MarkerCluster.css"/>
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster/dist/MarkerCluster.Default.css"/>
<script src="https://unpkg.com/leaflet.markercluster/dist/leaflet.markercluster-src.js"></script>
{% endif %}
{% endblock %}
{% block body %}
@@ -36,6 +42,7 @@
}
));
{% if data.type == "Coverage" or data.type == "CoverageCollection" %}
var layers = L.control.layers(null, null, {collapsed: false}).addTo(map)
CovJSON.read(JSON.parse('{{ data | to_json | safe }}')).then(function (cov) {
@@ -57,7 +64,28 @@
layers: [layer]
}).setLatLng(e.latlng).openOn(map)
})
{% elif data.type == "Feature" or data.type == "FeatureCollection" %}
var geojson_data = {{ data | to_json | safe }};
var items = new L.GeoJSON(geojson_data, {
onEachFeature: function (feature, layer) {
var html = '<span>' + {% if data['title_field'] %} feature['properties']['{{ data['title_field'] }}'] {% else %} feature.id {% endif %} + '</span>';
layer.bindPopup(html);
}
});
{% if data.type == "FeatureCollection" and data['features'][0]['geometry']['type'] == 'Point' %}
var markers = L.markerClusterGroup({
disableClusteringAtZoom: 9,
chunkedLoading: true,
chunkInterval: 500,
});
markers.clearLayers().addLayer(items);
map.addLayer(markers);
{% else %}
map.addLayer(items);
{% endif %}
map.fitBounds(items.getBounds(), {maxZoom: 15});
{% endif %}
</script>
{% endif %}
{% endblock %}