tbfleming / jscut

In-browser CAM package
http://jscut.org
GNU General Public License v3.0
295 stars 136 forks source link

Make lines easier to click #40

Open peteruithoven opened 9 years ago

peteruithoven commented 9 years ago

When a shape doesn't have a fill and the line doesn't have a thicker width it's currently hard to select shapes. Could we find a way to alter the line width so that shapes are easier to click? Maybe this can be done with css? The following css would give all path, circle, rect etc elements a bigger stroke, when one hovers over them.

svg circle:hover, svg path:hover, svg rect:hover {
  stroke-width: 3px;
  stroke: #2A6496;
}
tiger12506 commented 9 years ago

That might be alarming. A color change would be better perhaps?

IMHO Makercam does this nicely -- you can drag a selection rectangle and anything it intersects gets selected. That's probably a lot tougher to implement?

peteruithoven commented 9 years ago

I figured out that I was wrong, in that the line would have to be thicker by default. But it would be great if we could do that invisibly (to not alter the drawing itself to much). Maybe using something like a transparent css glow.

@tiger12506, I like the selection rectangle, that could work in combination. One problem with a rectangle is that it's hard to select one shape between multiple overlapping shapes.

tiger12506 commented 9 years ago

@peteruithoven - it does make it hard if you have to encompass the whole shape. However, I reference Makercam because they choose to select a shape if the rectangle intersects with the shape's outline, which is much easier to use for intricate details. Anyways, I'm not familiar with the code base, so I don't know if it's even feasible. All I know is that in #37 tbfleming says that he uses browser's built-in hit-testing.