Polyline and Polygon drawing/editing

[elcuervo]

Is there any plan or idea about adding drawing tools or something? i've playing with Path and writing a custom handler for it but perhaps there are better approaches.

[mourner]

Hi! Yes, I'm planning to implement drawing and editing of polylines and polygons. Enabling editing would place small draggable markers on vertexes of a poly and "ghost" markers in the middle of each segment. Web Maps API (predecessor to Leaflet) has such functionality, I just need to port it.

[astjohn]

+1

I'd love to see this as I was about to roll my own using Polymaps, but Leaflet looks like it's shaping into a better option.

[astjohn]

I'd like to try to help out if possible. My javascript is rusty, but I learn quickly.
Here's my starting point:
astjohn@f7be572

Please let me know how you'd like it structured and I can try to start to port the Web Maps API.
Thanks!

[mourner]

It would be harder for you I guess because WMA source is closed, and I have access to its uncompressed version. I think I'll finish off this feature during these 2 weeks.

[astjohn]

This reference works wonders:
http://jsbeautifier.org/
;-)

The WMA source is pretty straightforward and so it wasn't too hard to get started. Please have a look at my branch:
https://github.com/astjohn/Leaflet/tree/drawing

I have implemented the drawing and editing methods. For editing, I have up to drawing polygon squares for the endpoint markers. No dragging just yet. No specs though.

I'd love to hear what you think. I may be way off, in which case... please let me know. I'd love to learn more and help out where I can.

Cheers.

[astjohn]

Working on my branch. Please have a look when you get a chance so that I can tidy it up, restructure it as you'd like, fix errors, etc. I let a single mouse click remove the vertex and marker. I have not added "middle" markers.

Cheers.

[mourner]

Thanks, I'll take a closer look!
One suggestion I have is to optimize drag listener somehow so that it doesn't call indexOf every time (it's very expensive so dragging is kinda sluggish at the moment). Maybe calculate them for each marker on dragstart, or assign indexes on marker creation and then recalculate when adding/removing points.

[astjohn]

Will do. I also agree with the square markers. Thanks.

On Fri, Jul 22, 2011 at 5:44 PM, mourner <
reply@reply.github.com>wrote:

Thanks, I'll take a closer look!
One suggestion I have is to optimize drag listener somehow so that it
doesn't call indexOf every time (it's very expensive so dragging is kinda
sluggish at the moment). Maybe calculate them for each marker on dragstart,
or assign indexes on marker creation and then recalculate when
adding/removing points.

Reply to this email directly or view it on GitHub:
https://github.com/CloudMade/Leaflet/issues/174#issuecomment-1635275

[astjohn]

I just pushed some changes. On marker creation, I am setting a new class level variable _vertexIndex to the marker object itself. When a marker is removed, then the vertices are re-assigned for the remaining markers. No more use of indexOf.

Two questions:

• What do you think about the middle markers in the old version? Are they necessary?
• Should I extend this to polygons?

astjohn@d902cdf

[astjohn]

I have gone ahead and refactored to extend to polygons.
Let me know what you think. I'll make whatever changes you feel necessary and then issue a pull request.

https://github.com/astjohn/Leaflet/tree/drawing

Cheers.

[drewda]

@astjohn et al. I'm curious to know, what is the status of this functionality? I'm debating between using Polymaps (with its built-in editing) or trying to rig up my own editing interface with Polymaps. If Leaflet can do this, it would be a tempting alternative...

Thank you.

[astjohn]

@drewda,

This has been ready for quite some time. @mourner just has to accept the pull request. I have re-issued it with the latest changes from Cloudmade/master and it seems to still be functional. If you'd like to get a sneak peak, just take a look at my drawing branch.

[drewda]

Thanks for the quick response, @astjohn. I will try out your fork.

Have you, by chance, tried it on tablets? My goal is to have an editing interface on first an iPad and then an Android tablet.

[astjohn]

@drewda: not yet, but I love that idea. Let me know how it goes. Cheers.