(HTML5) Холст имеет эквивалент карты изображения?

Даже если нет, разве карта изображения на прозрачном изображении, расположенном над холстом, не даст вам то, что вам нужно?

Вы не думали использовать svg вместо canvas? В svg сама графика может содержать всю информацию, необходимую для идентификации активных областей, и вы можете подключить обработчики событий, как для html-элементов.

Некоторые примеры того, как вы можете обнаружить события мыши на различных частях геометрии фигур svg:

http://dev.w3.org/SVG/profiles/1.1F2/test/harness/htmlObject/interact-pevents-08-f.html

http://dev.w3.org/SVG/profiles/1.1F2/test/harness/htmlObject/interact-pevents-09-f.html

В качестве решения вашей проблемы: я бы прикрепил событие щелчка к холсту и к мыши -event Я бы исследовал координаты мыши, а затем простой список областей в сочетании с полигонами, на которых можно было бы провести какой-то тест на столкновение. Для начала можно использовать прямоугольники, но если вам действительно нужны особые области, придется провести более сложный тест на столкновение.

Быстрое решение, которое я использовал во Flash для карт точности пикселей, - это создание второго скрытого растрового изображения наложения, которое вы используете для поиска, когда кто-то щелкает по видимому изображению.

Та же техника, что и в старых приключенческих играх. Каждая «область / объект / ссылка» имеет свой цвет пикселя. И тогда вы просто сохраняете список объектов соответствующего цвета.

После того, как у вас есть цвет пикселя под курсором мыши, вы можете сделать очень быстрый поиск в таблице ... и бинго ...

Сначала вы очищаете "изображение щелчка" с нулями (черными), и это равно «без ссылки», то вы рисуете каждую область особым цветом и сохраняете этот цвет в списке.

Спросите, нужна ли вам дополнительная помощь. Надеюсь, это был полезный ответ.

Взгляните на Торт . Это плагин графа сцены для холста. Это может быть слишком сложно для того, что вы ищете, но вы можете добавлять события к объектам холста, обернутым Cake.