constrainChildrenOnResize отвечает за позиционирование и размером детей измененной клетки , Это означает, что дети должны сохранять свое положение относительно родительской клетки.
В вашем случае я предлагаю продлить mxVertexHandler с использованием метода union. В this example вы можете увидеть, как реализовать ограничения min-width/min-height. Используя этот пример, вы можете написать свои собственные правила для ограничения.
Вот мое простое решение:
var vertexHandlerUnion = mxVertexHandler.prototype.union;
mxVertexHandler.prototype.union = function (bounds) {
var result = vertexHandlerUnion.apply(this, arguments);
var coff = bounds.width/bounds.height
result.width = result.height * coff;
return result;
};
Так эта функция вызывается каждый раз, когда вы перемещаете мышь во время перетаскивания Resizer.
граница - объект, всегда одинаковый и представляет собой старую геометрию ячейки (перед изменением размера)
результате - объект, представляет новые значения, которые будут применяться. Между этой строкой объявление return вы можете разместить любой код, необходимый для изменения результата.
В моем простом примере я просто получаю начальное соотношение между шириной и высотой ячейки (coff), а затем устанавливаем новую ширину, умножая кофф и новую высоту. Он будет работать, если вы перетащите угол, сверху или снизу. В реальном проекте эта логика должна быть слегка расширена, или вы должны сделать видимыми только обработчики углов.
Кстати, этот код будет работать для всех изменяемых размеров ячеек на вашем графике. Если вы хотите применить его только к изображениям или некоторым другим типам ячеек - вы можете поместить условие и проверить тип ячейки перед пересчетом. Вы можете получить текущую ячейку или ее состояние через this.state.cell или this.state внутри функции соединения. Например, только для вертеков:
... ...
var result = vertexHandlerUnion.apply(this, arguments);
if (this.state.cell.isVertex()) {
//calculations here
}
return result;