Size of edit vertex (edit handle) is too big
See original GitHub issueI’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:
- Created 7 years ago
- Reactions:3
- Comments:9
Top GitHub Comments
0.4.9 fixes this issue.
On Wed, Feb 15, 2017 at 5:50 AM, Mat Beard notifications@github.com wrote:
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?