jeff/umap
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

show line and polygon measurements while drawing / editing

Browse source
This commit is contained in:
Philip Beelmann 2023-04-25 10:21:36 +00:00
parent 60fb67516d
commit ee6724cddb
2 changed files with 34 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
umap/static/umap/js/umap.controls.js
View file

@ -1250,9 +1250,11 @@ L.U.Editable = L.Editable.extend({
drawingTooltip: function (e) { drawingTooltip: function (e) {
var content; var content;
var readableDistance;
if (e.layer instanceof L.Marker) content = L._('Click to add a marker'); if (e.layer instanceof L.Marker) content = L._('Click to add a marker');
else if (e.layer instanceof L.Polyline) { else if (e.layer instanceof L.Polyline) {
// when drawing a Polyline or Polygon
if (e.layer.editor._drawnLatLngs) {
// when drawing first point
if (!e.layer.editor._drawnLatLngs.length) { if (!e.layer.editor._drawnLatLngs.length) {
if (e.layer instanceof L.Polygon){ if (e.layer instanceof L.Polygon){
content = L._('Click to start drawing a polygon'); content = L._('Click to start drawing a polygon');
@ -1260,13 +1262,24 @@ L.U.Editable = L.Editable.extend({
content = L._('Click to start drawing a line'); content = L._('Click to start drawing a line');
} }
} else { } else {
var tempLatLngs = e.layer.editor._drawnLatLngs.slice(); var readableDistance = e.layer.getMeasure(e.latlng);
tempLatLngs.push(e.latlng); if (e.layer.editor._drawnLatLngs.length < e.layer.editor.MIN_VERTEX) {
var length = L.GeoUtil.lineLength(this.map, tempLatLngs); // when drawing second point
readableDistance = L.GeoUtil.readableDistance(length, this.map.measureTools.getMeasureUnit()); content = L._('Click to continue drawing ({distance})', { distance: readableDistance });
} else {
// when drawing third point (or more)
content = L._('Click last point to finish shape ({distance})', { distance: readableDistance }); content = L._('Click last point to finish shape ({distance})', { distance: readableDistance });
} }
} }
} else {
// when moving an existing point
if (e.layer instanceof L.Polygon){
content = L._('Polygon area: {area}', { area: e.layer.getMeasure() });
} else if (e.layer instanceof L.Polyline) {
content = L._('Line distance: {distance}', { distance: e.layer.getMeasure() });
}
}
}
if (content) { if (content) {
this.map.ui.tooltip({content: content}); this.map.ui.tooltip({content: content});
} }

12
umap/static/umap/js/umap.features.js
View file

@ -853,8 +853,16 @@ L.U.Polyline = L.Polyline.extend({
return 'polyline'; return 'polyline';
}, },
getMeasure: function () { getMeasure: function (extraPoint) {
var length = L.GeoUtil.lineLength(this.map, this._defaultShape()); var polyline;
if (extraPoint){
var tmpLatLngs = this.editor._drawnLatLngs.slice();
tmpLatLngs.push(extraPoint);
polyline = tmpLatLngs;
} else {
polyline = this._defaultShape();
}
var length = L.GeoUtil.lineLength(this.map, polyline);
return L.GeoUtil.readableDistance(length, this.map.measureTools.getMeasureUnit()); return L.GeoUtil.readableDistance(length, this.map.measureTools.getMeasureUnit());
}, },