Code Monkey home page Code Monkey logo

Comments (5)

brandoncopeland avatar brandoncopeland commented on July 21, 2024

When a measure is started, a polygon is added to the map at coordinates [[90, -180], [90, 180], [-90, 180], [-90, -180]] (https://github.com/ljagis/leaflet-measure/blob/master/src/leaflet-measure.js#L146). Click events on this polygon will add points/vertexes to the measure geometry. Initially, this proved more reliable in some situations than listening to click events on the map.

In your example, adding the polygon at the coordinates [[90, -180], [90, 180], [-90, 180], [-90, -180]] doesn't cover the full map. The polygon is aqua shaded area below. Measurements would be performed in this area.
image

I suspect this is related to your custom crs defined in the map options. We'll need to look into the best method of adding the polygon to ensure full map coverage in this situation.. Or reevaluate if adding this polygon to collect click events is necessary.

from leaflet-measure.

Alloc86 avatar Alloc86 commented on July 21, 2024

Is there a way to query Leaflet for it's current screen bounds? So you know what coordinates you'd have to put the polygon on?
Drawback would probably be though that in this case you would have to disable zoom and pan as long as measurement is active as this would again move the poly out of the view (or listen for those events and update the poly).
What were the problems with map.on(click)?

from leaflet-measure.

stretchkerr avatar stretchkerr commented on July 21, 2024

I have the same issue - I can start a new measurement, but cannot add any points to the map. I works fine on my tablet (Chrome on Samsung Tab S 10.1), but does not work on my laptop.

I'm wondering if it has something to do with enabling scrolling on touch devices on the https://github.com/davicustodio/Leaflet.StyledLayerControl plugin, by adding this code:

if (!L.Browser.touch) {
L.DomEvent
.disableClickPropagation(control._container)
.disableScrollPropagation(control._container);
} else {
L.DomEvent.disableClickPropagation(control._container);
}

   L.control.scale().addTo(map);    

EDIT: I commented out the above code, and still I cannot place points on the map on chrome on laptop, but still works fine on tablet.

My page here: https://dl.dropboxusercontent.com/u/7075784/Leaflet/Leaflet2.html

from leaflet-measure.

brandoncopeland avatar brandoncopeland commented on July 21, 2024

Fixed at 5f0ead9.

When a measure is started, click events directly on the map are now used to add new measure points. The extra polygon overlay to collect click events was removed completely.

from leaflet-measure.

Alloc86 avatar Alloc86 commented on July 21, 2024

Thanks, working as expected :)

from leaflet-measure.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.