Javascript 在html中以多边形形式在区域上单击鼠标

我需要有一个区域，我会设置鼠标在事件上。我如何在JavaScript中做到这一点

这个区域应该是

易于定义 不可见我需要背景是可见的。

---

要使svg shapepolygon、rect、circle、path不可见，请将fill属性设置为none。为了使它仍然对事件做出响应，您需要将指针事件=可见。然后在形状中包含鼠标悬停事件。注: evt是svg事件对象调用。函数本身也可以应用于它所连接的elementtarget之外。例如，该函数可以在svg根中的任意位置绘制一个圆

e、 g

---

图像地图浮现在脑海中。它们已经有一万年的历史了，但很可能还能工作。

<svg id="mySVG" width="400" height="400">
<rect id="myRect" x="0" y="0" width="100%" height="100%" pointer-events="visible"  fill="none" onmouseover="myEvent(evt)" />
</svg>

<script>
    function myEvent(evt)
    {
       var target=evt.target
       target.setAttribute("fill","red")
    }
</script>