Question

我有一组SVG路径，当鼠标进入路径的某个附近时发送命中事件。我不希望路径周围的矩形框接近。这可能吗？

Answer 1

您可以添加不同（扩展）形状的命中区域，或者只是复制路径并添加大笔画。假设有一个标记，例如......

<svg xmlns="http://www.w3.org/2000/svg">
    <path d="m169,83c75,-44 220,145 96,110c-124,-35 -171,-66 -96,-110z"  class="hitarea" />
    <path d="m169,83c75,-44 220,145 96,110c-124,-35 -171,-66 -96,-110z" />
</svg>

然后你可以......

path {
   fill: black;
   stroke: green;
   stroke-width: 5;
   pointer-events: none;
}

path.hitarea {
   opacity: 0;
   stroke-width: 50;
    pointer-events: auto;
}

path.hitarea:hover + path {
    fill: red;
}

或者，如果您不需要在形状上使用笔划，那么您可以简单地放置一个大的透明笔划，它将起作用。

http://jsfiddle.net/MbsCh/

SVG路径接近检测

1 个答案: