在具有不规则形状的图像上制作可点击区域

Question

我正在尝试在印度地图上为某个项目制作一个图像地图，其中单击每个州时应该会导致另一个页面。为此我计划使用地图和区域标签。问题是每个状态的形状不是一个普通的数字，需要太多的坐标，而且可点击的区域可能会相交。

我想知道是否有另一种方式来实现这一任务 this is the image of the map i would like to work on

Answer 1

您可以使用SVG的实现这一目标。我在下面创建了一个Codepen，并以印度几个州的样本为例。

CODEPEN

CSS

<svg viewBox="0 0 300 200"> 
<a xlink:href="#"> 
    <path id="IN-HP" class="land" d="M143.6,94.2l0/> 
</a> 
</svg> 

抓住印度的免费SVG拷贝这里：https://www.amcharts.com/svg-maps/