Я пытаюсь использовать jQuery context menu, чтобы добавить контекстное меню по определенному элементу drawin в холсте html5, но я понятия не имею, как я могу привязать его к этому. Какие-нибудь советы?Контекстное меню на холсте
фигуры, нарисованные на холсте html5 нельзя ссылаться
Любая конкретная форма/путь вы нарисовали на холсте не запоминающийся - формы только пиксели на холсте. Таким образом, вы не можете привязать свое контекстное меню к форме без ссылок.
Итак ... Вы должны вручную найти свои формы
В качестве отправной точки, вы должны найти свою форму в «море пикселей».
Поиск круговых & прямоугольных форм с Math
Если форма имеет прямоугольную или круглую, вы можете найти математически, если щелчок мыши находится внутри формы, используя основы математики.
// test if the mouse is inside a circle
// Given the circle's centerpoint and its radius
var dx = mouseX-circleCenterX;
var dy = mouseY-circleCenterY;
var mouseIsInCircle = (dx*dx+dy*dy)<(circleRadius*circleRadius);
// test if the mouse is inside a rectangle
// Given the rectangle's x,y,width & height
var mouseIsInRect=(
mouseX>=rect1.x &&
mouseX<=rect1.x+rect1.width &&
mouseY>=rect1.y &&
mouseY<=rect1.y+rect1.height);
Нахождение более сложные пути с context.isPointInPath
способ сослаться на пути на холсте, чтобы поместить команды, которые создали путь в объекте. Когда вам нужно проверить этот путь, чтобы увидеть, следует ли развертывать контекстное меню, вы можете переопределить путь и использовать context.isPointInPath. Этот предыдущий Stackoverflow Q&A показывает, как использовать isPointInPath, чтобы проверить, находится ли мышь внутри вашего сложного пути.
Лучший способ с Path2D
Path2D встроен в большинство современных браузеров (но не IE), и это позволяет сохранить ссылку на свой сложный путь. Тогда вы можете использовать context.isPointInPath, чтобы определить Path2D до hit-test your Path2D.
Сам
Здесь контекстное меню предыдущего Stackoverflow Q&A, который показывает, как создать пользовательский контекстное меню.
Если вы хотите использовать контекстное меню jQuery, вам нужно будет динамически создавать меню по требованию и настраивать меню для отображения на желаемом [x, y] на холсте. Some assembly is required