SVG Marker onHover Event (Graph)

2020-04-07 11:19发布

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

For example (simplified):

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

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
1条回答
Explosion°爆炸
2楼-- · 2020-04-07 12:07

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.

Event attributes and event listeners attached to the contents of a ‘marker’ element are not processed; only the rendering aspects of ‘marker’ elements are processed.

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.

查看更多
登录 后发表回答