BPMN X Y location algorithm which big guy knows

Users
1

The matrix coordinate value I saw in the flowchart is different from the one set in the viewbox. Please inform me of the algorithm in the middle

2

Hello,

What exactly do you mean by “big guy” and “algorithm in the middle”?

3

canvas.viewbox and transform=‘matrix’ ， Conversion of coordinate values

4

Could you demonstrate that with a code snippet? We’re using SVG for rendering shapes. The positioning of the shapes are based on SVG transform attribute.

There’s no “algorithm in the middle”. This is the method in which we handle the transformation matrix of the shapes.

5

const canvas= this.Modeler.get(‘canvas’);
const contentNode =canvas.getDefaultLayer();
const bbox=contentNode.getBBox();
canvas.viewbox({x:bbox.x,y:bbox.y,width:bbox.width,height:bbox.height})

X，Y，Width,Height =》Coordinate problem

6

In your algorithm, x and y point to the min vector of the bounding box. So the x property of a bounding box does not mean it’s center point, but it’s left edge. In order to get the center of a bounding box:

var centerX = (boundingBox.x + boundingBox.width) / 2;
var centerY = (boundingBox.y + boundingBox.height) / 2;
7

Maybe you can describe what you’re trying to do and then we can dive into algorithms?