question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Size of edit vertex (edit handle) is too big

See original GitHub issue

I’ve recently switched to the 1.0 release of Leaflet and Leaflet Draw 0.4.7 (installed via NPM). Now when drawing or editing, the size of the editing vertex/handle is bigger than previously.

Inspecting the code reveals it’s 20px x 20px, but this is hard-coded into the element’s style attribute, rather than the result of a CSS class.

I’ve fiddled with the styles and it appears that it used to be around a quarter of the size (approx 10px x 10px).

Is the size of the edit handle easily configurable? The ‘old’ size was far better in my opinion, but I’d like to avoid fiddling with the source.

UPDATE: After a look in the source, it appears my implementation is defaulting to using the touchResizeIcon (20x20) rather than resizeIcon (8x8).

It seems touch is enabled based on browser rather than device:

// if touch, switch to touch icon
if (L.Browser.touch) {
	this.options.moveIcon = this.options.touchMoveIcon;
	this.options.resizeIcon = this.options.touchResizeIcon;
}

so I’ve manually set L.Browser.touch to false, which has fixed the size of the edit vertex, but now I can no longer click on the last point of a LineString to finish the line!

Issue Analytics

  • State:open
  • Created 7 years ago
  • Reactions:3
  • Comments:9

github_iconTop GitHub Comments

3reactions
germanjoeycommented, Feb 15, 2017

0.4.9 fixes this issue.

On Wed, Feb 15, 2017 at 5:50 AM, Mat Beard notifications@github.com wrote:

I’ve recently switched to the 1.0 release of Leaflet and Leaflet Draw 0.4.7 (installed via NPM). Now when drawing or editing, the size of the editing vertex/handle is bigger than previously.

Inspecting the code reveals it’s 20px x 20px, but this is hard-coded into the element’s style attribute, rather than the result of a CSS class.

I’ve fiddled with the styles and it appears that it used to be around a quarter of the size (approx 10px x 10px).

Is the size of the edit handle easily configurable? The ‘old’ size was far better in my opinion, but I’d like to avoid fiddling with the source.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/Leaflet/Leaflet.draw/issues/692, or mute the thread https://github.com/notifications/unsubscribe-auth/AAzNEp5wQ-stm2AApRs-nhxC_0tPnjDTks5rcwK1gaJpZM4MBvMk .

2reactions
Sparksxcommented, Apr 12, 2017

I’ve same issue as @matbeard with following user agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/57.0.2987.133 Safari/537.36

Chrome on mac support touch event but it does not have touch screen. 20x20px handler not really needed

Use (L.Browser.mobile && L.Browser.touch) to show touch handler is probably the solution?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Error Vertex coordinate too big adjust object scale - 3ds Max
Hi, whenever I try and export my high poly model in .obj I get this vertex coordinate too big error, I don't know...
Read more >
Changing Vertex Display Size - Maya - Highend3D
Hello guys, I can't seem to find maya's options for changing the display size of vertices (as seen in the viewport).
Read more >
Changing Vertex and Cusor Size in ArcInfo Editing
It is possible - in the Editor toolbar click the Options Button, there you can change the size and color of the vertices....
Read more >
Edit Mesh manually | Live2D Manuals & Tutorials
Manual editing of the mesh allows the positions of the vertices to be ... Click and drag on the width handles to adjust...
Read more >
Change vertex style in leaflet draw - Stack Overflow
Leaflet draw edges are too big and ugly, I've looked on a way to change its style and I came up with the...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found