Leaflet
Set size of vertex icons
In desktop browsers we need bigger vertex icons for usability reasons. Currently in Leaflet.Editable the size is hardcoded as follows:
L.Editable.VertexIcon = L.DivIcon.extend({
options: {
iconSize: new L.Point(8, 8)
}
});
It would be nice if the iconSize could be passed upon initialization of Leaflet.Editable e.g as an option when calling enableEdit().
+1 You can hack the size in CSS with something like:
.leaflet-vertex-icon {
max-width: 10px;
max-height: 10px;
margin-left: -5px !important;
margin-top: -5px !important;
}
.leaflet-middle-icon {
max-width: 10px;
max-height: 10px;
margin-left: -5px !important;
margin-top: -5px !important;
}
But you still have the MiddleMarker visibility set by the hardcoded iconSize:
size = L.point(this.options.icon.options.iconSize);
if (leftPoint.distanceTo(rightPoint) < size.x * 3) this.hide();
Hi, I happen to have a need for this feature as well, and I can try sending a PR for this.
I'm thinking of taking an option for vertexIconClass and touchVertexIconClass, in which they can specify their own option for icon size, and also provides the flexibility of customising other aspects of the icon. Thoughts?
@db255 Thanks for the CSS hack which helped me to resize the white rectangles. I also wish there would be programmatic way to set the size and style of those handles.
