Comments (7)
+1
from leaflet-measure.
on line 5011, replace with :
var measure = function (latlngs) {
var last = _.last(latlngs);
var path = geocrunch.path(_.map(latlngs, function (latlng) {
return [latlng.lng, latlng.lat];
}));
return {
lastCoord: {
dd: {
x: last.lng,
y: last.lat
},
dms: {
x: ddToDms(last.lng, 'E', 'W'),
y: ddToDms(last.lat, 'N', 'S')
}
},
length: {
feet: path.distance({
units: 'feet'
}),
miles: path.distance({
units: 'miles'
}),
meters: path.distance({
units: 'meters'
}),
kilometers: path.distance({
units: 'kilometers'
})
},
area: {
acres: path.area({
units: 'acres'
}),
sqmeters: path.area({
units: 'sqmeters'
})
}
};
};
from leaflet-measure.
+1! Thanks @hernangomez .. but I guess some more changes in the file would be required? I suspect it's at the lines:
var controlTemplate = _.template(.....
var resultsTemplate = _.template("<div ....
var linePopupTemplate = _.template("<h3>Lin...
var areaPopupTemplate = _.template("<h3>A...
from leaflet-measure.
Done! I changed miles to km, feet to meters, while keeping area in acres, since that's what the common system is here in India. Request to the developer to please introduce a variable at the top of the script, separately for distance and for area. So setting it this way or that should make the desired changes. Or maybe an option in the front-end?
Changed these lines, from 5108 (after incorporating @hernangomez 's edits):
var controlTemplate = _.template("<a class=\"<%= model.className %>-toggle js-toggle\" href=\"#\" title=\"Measure distances and areas\">Measure</a>\n<div class=\"<%= model.className %>-interaction js-interaction\">\n <div class=\"js-startprompt startprompt\">\n <h3>Measure Distances and Areas</h3>\n <ul class=\"tasks\">\n <a href=\"#\" class=\"js-start start\">Create a new measurement</a>\n </ul>\n </div>\n <div class=\"js-measuringprompt\">\n <h3>Measure Distances and Areas</h3>\n <p class=\"js-starthelp\">Start creating a measurement by adding points to the map</h3>\n <div class=\"js-results results\"></div>\n <ul class=\"js-measuretasks tasks\">\n <li><a href=\"#\" class=\"js-cancel cancel\">Cancel</a></li>\n <li><a href=\"#\" class=\"js-finish finish\">Finish Measurement</a></li>\n </ul>\n </div>\n</div>");
var resultsTemplate = _.template("<div class=\"group\">\n<p class=\"lastpoint heading\">Last Point</p>\n<p><%= model.lastCoord.dms.y %> <span class=\"coorddivider\">/</span> <%= model.lastCoord.dms.x %></p>\n<p><%= humanize.numberFormat(model.lastCoord.dd.y, 6) %> <span class=\"coorddivider\">/</span> <%= humanize.numberFormat(model.lastCoord.dd.x, 6) %></p>\n</div>\n<% if (model.pointCount > 1) { %>\n<div class=\"group\">\n<p><span class=\"heading\">Path Distance</span> <%= humanize.numberFormat(model.length.meters, 0) %> Meters (<%= humanize.numberFormat(model.length.kilometers, 2) %> Kilometers)</p>\n</div>\n<% } %>\n<% if (model.pointCount > 2) { %>\n<div class=\"group\">\n<p><span class=\"heading\">Area</span> <%= humanize.numberFormat(model.area.acres, 2) %> Acres</p>\n</div>\n<% } %>");
var pointPopupTemplate = _.template("<h3>Point Location</h3>\n<p><%= model.lastCoord.dms.y %> <span class=\"coorddivider\">/</span> <%= model.lastCoord.dms.x %></p>\n<p><%= humanize.numberFormat(model.lastCoord.dd.y, 6) %> <span class=\"coorddivider\">/</span> <%= humanize.numberFormat(model.lastCoord.dd.x, 6) %></p>\n<ul class=\"tasks\">\n <li><a href=\"#\" class=\"js-zoomto zoomto\">Center on this Location</a></li>\n <li><a href=\"#\" class=\"js-deletemarkup deletemarkup\">Delete</a></li>\n</ul>");
var linePopupTemplate = _.template("<h3>Linear Measurement</h3>\n<p><%= humanize.numberFormat(model.length.meters, 0) %> Meters</p>\n<p><%= humanize.numberFormat(model.length.kilometers, 2) %> Kilometers</p>\n<ul class=\"tasks\">\n <li><a href=\"#\" class=\"js-zoomto zoomto\">Center on this Line</a></li>\n <li><a href=\"#\" class=\"js-deletemarkup deletemarkup\">Delete</a></li>\n</ul>");
var areaPopupTemplate = _.template("<h3>Area Measurement</h3>\n<p><%= humanize.numberFormat(model.area.acres, 2) %> Acres</p>\n<p><%= humanize.numberFormat(model.length.meters, 0) %> meters (<%= humanize.numberFormat(model.length.kilometers, 2) %> Kilometers) Perimeter</p>\n<ul class=\"tasks\">\n <li><a href=\"#\" class=\"js-zoomto zoomto\">Center on this Area</a></li>\n <li><a href=\"#\" class=\"js-deletemarkup deletemarkup\">Delete</a></li>\n</ul>");
Here's a Diff to highlight the changes: https://www.diffchecker.com/bjcb9gnv
from leaflet-measure.
I've forked and put my version here: 1b4776a
Not making a pull request, since I'm just changing this to suit my requirements which would not be suitable for the original project.
Rather, we should be able to pass our choice of units as a control option. And it helps to have a secondary unit to specify that'll appear in brackets, as happens now for length. I don't know how to code that into the script, but here's a probable example of how I'd pass it:
var measureControl = L.control.measure({
position: 'bottomright',
activeColor: '#0004FC',
completedColor: '#0004FC'
lengthUnit: 'meters',
lengthUnit2: 'kilometers',
areaUnit: 'acres'
areaUnit2: 'hectares'
});
measureControl.addTo(map);
from leaflet-measure.
that will be very welcome to be able to have this options above, thanks
from leaflet-measure.
Sorry it took a while on this. Unit options added with commit a1592eb.
You can now pass primaryLengthUnit
, secondaryLengthUnit
, primaryAreaUnit
, secondaryAreaUnit
options. The secondary units are optional. If omitted, only values in the primary units will be displayed.
Supported values for length are feet
, meters
, miles
, and kilometers
. Defaults are feet
and miles
Supported values for area are acres
, hectares
, sqmeters
, and sqmiles
. Defaults are acres
and no secondary.
from leaflet-measure.
Related Issues (20)
- how to set the rounding to 2 decimal places HOT 1
- Listening for measurefinish event HOT 1
- Is it possible to disable the autocomplete?
- Apply a different coordinate system to Coordinate Output?
- Measure not visible on layers HOT 6
- green dotted line appearing
- Adding Perimeter value to the measurefinish results data
- Customizing map feature styles?
- Polyline don't show up when measure starts - Django
- Angular 2 is unable to compile sass due to relative paths to package assets HOT 2
- localization HOT 3
- Show Measure Popup onclick
- Allow to adjust the vertices
- Does not work in Leaflet 1.8.0 HOT 8
- How to start the measurement directly whiling clicking the toggle button?
- Property 'Measure' does not exist on type 'typeof control' in Angular CLI HOT 2
- Is this project still upkept? HOT 5
- typings for Angular 14
- after clicking on map it changes center of the map HOT 3
- bug HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from leaflet-measure.