SVG标记onHover事件(图形) [英] SVG Marker onHover Event (Graph)

问题描述

我正在构建自己的折线图，想知道如何在悬停时使<path>线变为交互式.

I am building my own line graph and wanted to know how would I go about making a <path> line interactive on hover.

例如(简体):

<path d="M5,10L10,20L30,40"></path>

当用户将鼠标悬停在5,10或10,20并显示<circle>或通常只是一条命令时，我将如何执行悬停事件?是我缺少了什么，还是必须检测鼠标的位置?

How would I execute a hover event when the user hovers over 5,10 or 10,20 and show a <circle> or just a command in general? Is there something I'm missing or do I have to detect the mouse's position?

推荐答案

SVG具有称为标记的概念，该标记允许将任意形状添加到路径节点，但标记不能接收事件，

SVG has a concept called markers that allow arbitrary shapes to be added to path nodes but markers cannot receive events, per the last line in the SVG marker specification text.

附加到标记"元素内容上的事件属性和事件侦听器；仅处理标记"元素的呈现方面.

如果您认为这种情况应该有所改变，请与w3c SVG组一起使用.

If you think this should change, take it up with the w3c SVG group.

如果要响应事件，则必须手动创建自己的形状，并确保它们恰好位于正确的位置.

If you want to respond to events you'd have to manually create your own shapes and ensure that they happen to be situated at the correct points.

这篇关于SVG标记onHover事件(图形)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！