单击svg线很难击中，任何想法如何围绕线放置点击区域 [英] clicking a svg line its hard to hit,any ideas how to put a click area around a line

问题描述

我有一个SVG绘图，我想单击它上的线条.如果您打了有时确实很瘦的家伙，那很好.

I have a SVG Drawing, I want to click the lines on it. That works fine, if you hit the sometimes realy thin guy.

有人有什么想法，如何使线条更容易单击-而不只是增大笔划宽度"?

Does anybody have an idea, how to make the line clicking easier - without just enlarging "stroke-width"?

我尝试使用两条线(一条白色加粗一条黑色细线)，但随后的渲染顺序破坏了图形的某些部分.

I tried using two lines (one white thicker one black thin), but then the rendering order destroys parts of the drawing.

有什么主意吗?

推荐答案

绘制两条线，一条要查看，另一条粗线，即笔划宽度但可见性为隐藏"，然后在隐藏线为点击可见线.您可能需要调整 pointer-events 属性以将其用于可见行(pointer-events ="none")并为隐藏线启用它(pointer-events ="all")

Draw two lines, one the one you want to see and another thicker i.e. with a stroke-width but with visibility="hidden" and then treat clicks on the hidden line as clicks on the visible line. You may need to adjust the pointer-events property to disable it for the visible line (pointer-events="none") and enable it for the hidden line (pointer-events="all")

这篇关于单击svg线很难击中，任何想法如何围绕线放置点击区域的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！