Wrapper of mxAbstractCanvas2D to simplify method calls when painting icons/markers of BPMN shapes.

It can scale dimensions passed to the method of the original mxAbstractCanvas2D.

WARN: You may use it to customize the BPMN Theme as suggested in the examples. But be aware that the way the default BPMN theme can be modified is subject to change.

Example

The vanilla canvas calls when a scale factor must be applied to position

const scaleX = 0.26;
const scaleY = 0.35;
c.moveTo(8 * scaleX, 39 * scaleY);
c.lineTo(12 * scaleX, 25 * scaleY);

Example

With BpmnCanvas

const canvas = new BpmnCanvas(c, 0.26, 0.35);
canvas.moveTo(8, 39);
canvas.lineTo(12, 25);

Constructors

Methods

  • Set the icon origin to ensure that, on the shape, the icon is horizontally centered and vertically aligned to the bottom.

    Parameters

    • bottomMargin: number = StyleDefault.SHAPE_ACTIVITY_BOTTOM_MARGIN

    Returns void

  • Set the icon origin to the top left corner of the shape.

    Parameters

    • topMargin: number = StyleDefault.SHAPE_ACTIVITY_TOP_MARGIN
    • leftMargin: number = StyleDefault.SHAPE_ACTIVITY_LEFT_MARGIN

    Returns void

  • Translate the icon origin using the scale factor associated to the horizontal and vertical directions.

    The values should be given with using the icon original size (as translated values will be scaled as other values passed to method of this class).

    Parameters

    • dx: number

      the horizontal translation

    • dy: number

      the vertical translation

    Returns void