В канве ширины * высоты пикселей есть многоугольники.Я должен вставить прямоугольник, центр которого должен быть как можно ближе к определенному пикселю.Но прямоугольник не может пересекаться ни с одним из существующих многоугольников.
Я мог бы сделать это с квадратом, потому что я нарисовал бы многоугольники с штрихом, равным размеру квадрата, а затем нашел бы ближайшую точку, которая имеетнет цвета, проверяя каждую точку.
Эта функция может проверять, можно ли нарисовать прямоугольник, не пересекая другой многоугольник: http://www.kevlindev.com/gui/math/intersection/index.htm#Anchor-intersectPolygonRectangl-23720
Но это было бы слишком интенсивно для процессора, чтобы сделать это для каждой точки(как центр прямоугольника).
РЕДАКТИРОВАТЬ: заменен трюк strokeWidth этим методом рисования линий (w, h - половина высоты, ширина прямоугольника)
function _addSegment(ctx, x1, y1, x2, y2, w, h) {
ctx.beginPath()
if (y2 >= y1) {
if (x2 >= x1) {
ctx.moveTo(x1 - w, y1 + h)
ctx.lineTo(x1 - w, y1 - h)
ctx.lineTo(x1 + w, y1 - h)
ctx.lineTo(x2 + w, y2 - h)
ctx.lineTo(x2 + w, y2 + h)
ctx.lineTo(x2 - w, y2 + h)
} else {
ctx.moveTo(x1 - w, y1 - h)
ctx.lineTo(x1 + w, y1 - h)
ctx.lineTo(x1 + w, y1 + h)
ctx.lineTo(x2 + w, y2 + h)
ctx.lineTo(x2 - w, y2 + h)
ctx.lineTo(x2 - w, y2 - h)
}
} else {
if (x2 >= x1) {
ctx.moveTo(x1 + w, y1 + h)
ctx.lineTo(x1 - w, y1 + h)
ctx.lineTo(x1 - w, y1 - h)
ctx.lineTo(x2 - w, y2 - h)
ctx.lineTo(x2 + w, y2 - h)
ctx.lineTo(x2 + w, y2 + h)
} else {
ctx.moveTo(x1 + w, y1 - h)
ctx.lineTo(x1 + w, y1 + h)
ctx.lineTo(x1 - w, y1 + h)
ctx.lineTo(x2 - w, y2 + h)
ctx.lineTo(x2 - w, y2 - h)
ctx.lineTo(x2 + w, y2 - h)
}
}
ctx.fill()
}