From e42ed4373f145697a8267f6b4d7b5eea27521fd0 Mon Sep 17 00:00:00 2001 From: Yohan Boniface Date: Wed, 14 Aug 2024 12:02:08 +0200 Subject: [PATCH] wip: do not fail when setting "Circles" layer with non markers data --- umap/static/umap/js/modules/data/features.js | 38 +++++--------------- umap/static/umap/js/modules/rendering/ui.js | 24 +++++++++++-- umap/static/umap/js/umap.controls.js | 4 +-- 3 files changed, 33 insertions(+), 33 deletions(-) diff --git a/umap/static/umap/js/modules/data/features.js b/umap/static/umap/js/modules/data/features.js index be97494ff..4a1daf4c0 100644 --- a/umap/static/umap/js/modules/data/features.js +++ b/umap/static/umap/js/modules/data/features.js @@ -119,7 +119,7 @@ class Feature { } getUIClass() { - return this.getOption('UIClass') || this.getDefaultUIClass() + return this.getOption('UIClass') } getClassName() { @@ -560,8 +560,8 @@ class Feature { properties.lon = center.lng properties.lng = center.lng properties.alt = center?.alt - if (typeof this.getMeasure !== 'undefined') { - properties.measure = this.getMeasure() + if (typeof this.ui.getMeasure !== 'undefined') { + properties.measure = this.ui.getMeasure() } } return L.extend(properties, this.properties) @@ -601,8 +601,8 @@ export class Point extends Feature { return { coordinates: GeoJSON.latLngToCoords(latlng), type: 'Point' } } - getDefaultUIClass() { - return LeafletMarker + getUIClass() { + return super.getUIClass() || LeafletMarker } hasGeom() { @@ -710,16 +710,6 @@ class Path extends Feature { ] } - getStyle() { - const options = {} - for (const option of this.ui.getStyleOptions()) { - options[option] = this.getDynamicOption(option) - } - if (options.interactive) options.pointerEvents = 'visiblePainted' - else options.pointerEvents = 'stroke' - return options - } - getBestZoom() { return this.getOption('zoomTo') || this.map.getBoundsZoom(this.bounds, true) } @@ -805,19 +795,14 @@ export class LineString extends Path { return !this.coordinates.length } - getDefaultUIClass() { - return LeafletPolyline + getUIClass() { + return super.getUIClass() || LeafletPolyline } isSameClass(other) { return other instanceof LineString } - getMeasure(shape) { - const length = L.GeoUtil.lineLength(this.map, shape || this.ui._defaultShape()) - return L.GeoUtil.readableDistance(length, this.map.measureTools.getMeasureUnit()) - } - toPolygon() { const geojson = this.toGeoJSON() geojson.geometry.type = 'Polygon' @@ -922,9 +907,9 @@ export class Polygon extends Path { return !this.coordinates.length || !this.coordinates[0].length } - getDefaultUIClass() { + getUIClass() { if (this.getOption('mask')) return MaskPolygon - return LeafletPolygon + return super.getUIClass() || LeafletPolygon } isSameClass(other) { @@ -956,11 +941,6 @@ export class Polygon extends Path { return options } - getMeasure(shape) { - const area = L.GeoUtil.geodesicArea(shape || this.ui._defaultShape()) - return L.GeoUtil.readableArea(area, this.map.measureTools.getMeasureUnit()) - } - toLineString() { const geojson = this.toGeoJSON() delete geojson.id diff --git a/umap/static/umap/js/modules/rendering/ui.js b/umap/static/umap/js/modules/rendering/ui.js index c6df741aa..a1ce47c96 100644 --- a/umap/static/umap/js/modules/rendering/ui.js +++ b/umap/static/umap/js/modules/rendering/ui.js @@ -7,6 +7,7 @@ import { DomUtil, LineUtil, latLng, + LatLng, LatLngBounds, } from '../../../vendors/leaflet/leaflet-src.esm.js' import { translate } from '../i18n.js' @@ -267,7 +268,7 @@ export const LeafletMarker = Marker.extend({ const PathMixin = { _onMouseOver: function () { if (this._map.measureTools?.enabled()) { - this._map.tooltip.open({ content: this.feature.getMeasure(), anchor: this }) + this._map.tooltip.open({ content: this.getMeasure(), anchor: this }) } else if (this._map.editEnabled && !this._map.editedFeature) { this._map.tooltip.open({ content: translate('Click to edit'), anchor: this }) } @@ -334,7 +335,7 @@ const PathMixin = { let items = FeatureMixin.getContextMenuItems.call(this, event) items.push({ text: translate('Display measure'), - callback: () => Alert.info(this.feature.getMeasure()), + callback: () => Alert.info(this.getMeasure()), }) if (this._map.editEnabled && !this.feature.isReadOnly() && this.feature.isMulti()) { items = items.concat(this.getContextMenuMultiItems(event)) @@ -468,6 +469,12 @@ export const LeafletPolyline = Polyline.extend({ }) return items }, + + getMeasure: function (shape) { + // FIXME: compute from data in feature (with TurfJS) + const length = L.GeoUtil.lineLength(this._map, shape || this._defaultShape()) + return L.GeoUtil.readableDistance(length, this._map.measureTools.getMeasureUnit()) + }, }) export const LeafletPolygon = Polygon.extend({ @@ -502,6 +509,11 @@ export const LeafletPolygon = Polygon.extend({ startHole: function (event) { this.enableEdit().newHole(event.latlng) }, + + getMeasure: function (shape) { + const area = L.GeoUtil.geodesicArea(shape || this._defaultShape()) + return L.GeoUtil.readableArea(area, this._map.measureTools.getMeasureUnit()) + }, }) const WORLD = [ latLng([90, 180]), @@ -541,6 +553,14 @@ export const MaskPolygon = LeafletPolygon.extend({ export const CircleMarker = BaseCircleMarker.extend({ parentClass: BaseCircleMarker, includes: [FeatureMixin, PathMixin], + initialize: function (feature, latlng) { + if (Array.isArray(latlng) && !(latlng[0] instanceof Number)) { + // Must be a line or polygon + const bounds = new LatLngBounds(latlng) + latlng = bounds.getCenter() + } + FeatureMixin.initialize.call(this, feature, latlng) + }, getClass: () => CircleMarker, getStyleOptions: function () { const options = PathMixin.getStyleOptions.call(this) diff --git a/umap/static/umap/js/umap.controls.js b/umap/static/umap/js/umap.controls.js index 4fcd3fc1f..6de1f61fe 100644 --- a/umap/static/umap/js/umap.controls.js +++ b/umap/static/umap/js/umap.controls.js @@ -1261,7 +1261,7 @@ U.Editable = L.Editable.extend({ } else { const tmpLatLngs = e.layer.editor._drawnLatLngs.slice() tmpLatLngs.push(e.latlng) - measure = e.layer.feature.getMeasure(tmpLatLngs) + measure = e.layer.getMeasure(tmpLatLngs) if (e.layer.editor._drawnLatLngs.length < e.layer.editor.MIN_VERTEX) { // when drawing second point @@ -1273,7 +1273,7 @@ U.Editable = L.Editable.extend({ } } else { // when moving an existing point - measure = e.layer.feature.getMeasure() + measure = e.layer.getMeasure() } if (measure) { if (e.layer instanceof L.Polygon) {