Добавление взаимодействия с пользователем в элемент canvas

Question

Я только начинаю работу с элементом canvas и хочу создать что-то вроде элемента панорамирования здесь : и для ясности он изображен здесь:

.

Я бы хотел сохранить очень похожую функциональность. к примеру, который я разместил. Я сделал грубый макет (извините за ужасное качество кода) того, что я хотел бы сделать. Итак, я недавно переключил свою графику на использование холста, а не неуклюже стилизованных элементов DOM, и мне было интересно, будет ли разумно выбрать тот же маршрут для этого элемента панорамирования. Кроме того, как можно избежать перерисовки всего кадра при каждом перемещении или изменении размера элемента панорамирования?

Answer 1

Вы можете сделать это аналогично событиям мыши на элементе canvas и использовать их для определения того, что рисовать на холсте, чтобы избежать перерисовки, вы можете выборочно очистить части рамки и перерисовать эту часть как эту частьизменяется с помощью функции clearRect, http://dev.opera.com/articles/view/html-5-canvas-the-basics/ в разделе основных линий и штрихов.