Могу ли я создать форму полукруга на карте области изображения html?

Question

Мне нужно сделать форму полукруга на изображении, используя Html image тег карты .

Это код, но он образует круг.

<img src="floorplan1.png" usemap="#image-map">

<map name="image-map">
    <area target="" alt="" title="" href="" coords="494,686,91" shape="circle">
</map>

Возможно ли это сделать? Если да, то, пожалуйста, скажите, как это сделать.

Answer 1

Вы можете использовать shape=poly и определить каждую координату. Посмотрите на пример ниже. Вы также можете использовать https://www.image-map.net/, чтобы сгенерировать его онлайн на своем изображении.

В приведенном ниже примере попробуйте нажать на растение.

<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcR4C5coWnjUpQ619SpeV_MwkBj57xOa-0Jd-mLAHP2R2Ic9OY_G" usemap="#image-map">

<map name="image-map">
    <area target="" alt="" title="" href="" coords="181,257,245,246,292,201,307,135,269,76,226,53,183,55,185,151" shape="poly">
</map>