Skip to main content

afterItemResize

Description​

Fires after an item's size has been changed

Usage​

"afterItemResize": ({
    id: string | number, 
    width: number,
    height: number,
    x: number,
    y: number,
    dir: "n" | "ne" | "e" | "se" | "s" | "sw" | "w" | "ne"
}) => void;

Parameters​

The callback of the event is called with an object with the following parameters:

  • id - the id of the resized item
  • width - the new width of the item
  • height - the new height of the item
  • x - the new X-coordinate of the item
  • y - the new Y-coordinate of the item
  • dir - the direction of the resize operation:
    • "n" - north
    • "ne" - north-east
    • "e" - east
    • "se" - south-east
    • "s" - south
    • "sw" - south-west
    • "w" - west
    • "nw" - north-west

Example​

// initializing Diagram Editor
const editor = new dhx.DiagramEditor("editor_container");
// loading data
editor.parse(data);

// attaching a handler to the event
editor.events.on("afterItemResize", ({ id, width, height }) => {
    console.log(`
        The item ${id} has been resized: 
            width: ${width} 
            height: ${height}
    `);
});

Change log:

  • The event is added in v6.1

Related API:

Related samples: