canvas и чертеж

[ecSpl01t]

Приветствую!
Имею чертеж в .пдф нужно запихнуть его на сайт и для каждой комнаты сделать вывод фото той комнаты на которую навели мышкой..
То есть, пользователь нашел на сайт, видит чертеж, навел мышкой на комнату и ему показалась фото той комнаты..

Подскажите как сделать так?! Я так понимаю нужно делать фигуру комнаты в canvas, но я не понимаю как это сделать
я разобрался в канвар только как рисовать линии, но дальше не понимаю..

[laimas]

Отдавать клиенту как изображение к которому описана карта.

[Leon-on12]

Почему бы не наделать пустых дивов каждый спозиционированный поверх комнаты? И не сделать :hover фоток?

Комнаты прямоугольные же

[ecSpl01t]

Почему бы не наделать пустых дивов каждый спозиционированный поверх комнаты? И не сделать :hover фоток?

Комнаты прямоугольные же

не все, если бы были все прямоугольные... =(

[Leon-on12]

ecSpl01t,
Вот тебе ссылка. http://w3pro.ru/article/html-5-canva...chinayushchikh
Это то по чему я учился. Вкратце: context.beginPath() - начать рисовать фигуру. context.moveTo(10, 10); - поставить точку на координату 10 10. context.lineTo(100, 10); - провести линию от предыдущей точки до этой. context.fill(); залить фигуру цветом; context.fillStyle = '#00f'; назначить цвет заливки.

Только как вам это поможет?

[ecSpl01t]

в этом я чуть разобрался и заливку сделал, но а евент все равно срабатывает на весь canvas а не на рисунок..

[Sweet]

Вот же странно. Задача решается одной (ОДНОЙ, КАРЛ!) строчкой кода, если использовать <map>. Просто вешаешь обработчик mouseover на <area>, который показывает картинку из href-атрибута. Всё!

[Sweet]

заливку сделал, но а евент все равно срабатывает на весь canvas а не на рисунок

<canvas> - это не html-элемент произвольной формы, опреледяемой изображением. <canvas>, как и остальные - прямоугольник. И события ловятся на всём этом прямоугольнике. И нельзя нативно нарисовать фигуру и повесить на неё обработчик. Короче, канвас не для решения твоей задачи.

[ecSpl01t]

спасибо всем за ответы!