О равной функции в Javascript?

Question

Хорошо, у меня есть HTML-холст с кучей кружков на нем.Я хочу, чтобы события щелчка мышью на кругах вызывали некоторую функцию Javascript.У меня уже есть основы, но координаты, очевидно, настолько точны, что мне требуется 30 раз, чтобы попасть в точные координаты определенного круга.

Есть ли способ, которым я мог бы реализовать«примерно равный»;другими словами, я хотел бы, чтобы x и y щелчка мыши вызывали функцию, когда она довольно близка (скажем, 10px) к координатам чего-либо на холсте?

Спасибо

Алекс

Answer 1

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

function withinRadius (x1, y1, x2, y2, radius) {
 var dX = x1 - x2, dY = y1 - y2;
 return ((dX*dX) + (dY*dY) < radius*radius);
 }

Answer 2

Первые мысли:

   if ((mouselocx >= (corodinatex - 10)) && (mouselocx <= (corodinatex + 10)) {
    if ((mouselocy >= (corodinatey - 10)) && (mouselocy <= (corodinatey + 10)) {
Do something...    
}
    }

Answer 3

В общем случае вы хотите проверить, щелкнули ли вы в пределах многоугольника, созданного путем расширения кривой в обоих направлениях - влево и вправо. Вычисление этого многоугольника в случае кривых Безье, общих конических сечений и т. Д. Сложно. Большинство графических библиотек позволяют вам устанавливать параметр ширины штриха и делать это за вас. Нарисуйте широкую кривую в цвете фона ниже кривой 1px и проверьте наличие совпадений на широкой. Просто убедитесь, что вы рисуете все цвета фона перед любым из цветов переднего плана.

В вашем конкретном случае с кругами, если у вас нет такой графической библиотеки, вам будет достаточно посмотреть, нажали ли вы в пределах допустимого расстояния от центра круга. Если у вас очень мало кругов, вы можете просмотреть весь список. Если у вас есть более полудюжины (чутье, когда нужно обрезать до лучшего алгоритма), разделите экран на четверти со списком, в которые может попасть попадание в один из прямоугольников, а затем разделите на четверти в этом прямоугольнике и проверяйте кругами, что это может быть, пока у вас не будет только полдюжины или около того возможностей. Затем перейдите вниз по списку возможностей, проверяя, находитесь ли вы в своей дельте для любого из кругов.