Как реализовать функцию изменения размера для редактора 2D-чертежей? - PullRequest
0 голосов
/ 16 февраля 2020

Я использую JavaScript здесь, но язык не имеет значения, так как мне трудно понять математику ситуации.

У меня сложная форма, которая может состоять из множества точек. Вот пример: Complex Shape

Система координат для формы начинается сверху слева (0,0). Форма нормализуется, так как в ней нет отрицательных точек. Начальная точка пересчитывается; таким образом, фигура, которая находится перед ней в системе координат, находится в точке (0, x), (0, y) или (0,0). Кроме того, фигура имеет абсолютную координату, которая указывает ее место в «сцене»

Прежде чем мы перейдем к моему новому «resize logi c», я хочу поговорить о существующей логике c что я хочу построить новое на одном. Допустим, мы изменяем размер фигуры с западной стороны на западную. Поскольку форма всегда нормализуется, мы смещаем абсолютную позицию формы влево. В результате форма фактически начинается с новой позиции. Затем мы меняем положение внутренних точек (а не (0,0)), чтобы приспособиться к изменению абсолютной позиции, чтобы дать пользователю «ощущение» изменения размера.

Теперь перейдем к моей новой проблеме , Я пытаюсь реализовать изменение размера с использованием масштабного коэффициента в обоих направлениях (sx, sy). Это означает, что каждая точка в форме умножается на этот масштабный коэффициент. Это работает для изменения размера с восточной координаты, потому что начальная точка формы не изменяется. Однако это создает проблему при масштабировании от западного размера, потому что мы переводим позицию фигуры путем сложения, а затем, используя умножение, чтобы переместить каждую точку на новую позицию, я продолжаю получать такой результат:

Incorrect resize

Правая сторона вообще не должна была двигаться. Я просто не могу понять математику этой проблемы. Вот формула, которую я придумал, чтобы выяснить это:

Formula

А вот код, который соответствует ей (он находится в JavaScript но язык для меня не имеет значения):

// Get largest X-value in the local coordinate system
const maxX = element.points.reduce((prev, curr) => {
  return Math.max(prev, curr[0]);
}, -Infinity); 

const oldX = element.x; // previous absolute position
element.x += deltaX; // add mouse coordinate difference

element.scaleX += ((oldX + maxX) / (element.x + maxX)) / maxX;

// Divide everything by the maximum point to find "relative scale" and add it to the existing scale value.

Я предполагаю, что проблема заключается в делении значения масштаба на максимальную длину X. Однако я не уверен, как это исправить. Без деления значение ((oldX + maxX) / (element.x + maxX)) составляет около ~ 1,05, а добавление его к коэффициенту масштабирования делает значение масштаба чрезвычайно большим после 20 движений мыши (коэффициент масштабирования = ~ 20).

Я попытался предоставить как можно больше деталей насколько это возможно. Если вам нужны какие-либо другие детали, я готов предоставить свои формулы, код и т. Д. c.

Спасибо!

Гасим

...