PolygonDrawingTool, how to get width and height of the polygon?

GoJS
1

Hello,

I am using the PolygonDrawingTool from this example Polygon Drawing Tool and it is working pretty good for me. The only problem I am facing right now, is that I dont know how to get the “width” and the “height” of the polygon.
Looking into “width” and “height” showed NAN for both.
I need the width and height to display the polygon correctly after saving and loading the whole diagram.
Looking at the example, I saw that the width and height are not used and the polygon still keeps its size, I dont understand why this is not the case for me.

And there must be a value for “width” and “height”, because the rectangle surrounding the polygon uses the width and the height. I am talking about a rectangle like the one shown in the screenshot below.

I hope you can help me out here.

Best regards!

2

GraphObject.width and GraphObject.height are synonyms for GraphObject.desiredSize, which is a way of telling that object how big it should be.

If you want to know how big something is (in its container’s coordinate system), look at GraphObject.actualBounds.

Read more about sizing at GoJS Sizing of GraphObjects -- Northwoods Software.

3

Hello,

I am using the GraphObject.actualBounds to get the width and the height of the polygon, but something very weird is happening.
The values for “width” and “height” are not correct, for some reason it will always store the value 101.5 for both.
I dont understand this behaviour, look of at the screenshot below. What you see there is the result of:
console.log(diagram.findNodeForData(nodeDataArray[i]).actualBounds.size);
console.log(diagram.findNodeForData(nodeDataArray[i]).actualBounds);

How is it possible that the value is different? This is one object.
The value “height: 227” is the correct one but I am not able to access it, every timeI try to get it the returned value is 101.5.
The interesting thing is that the value shown (101.5) never changes, no matter how the polygon,I just created, looks like.
I also tried to get the height of the item at different times (right after the item has been created, right befor saving the whole diagram,…) but it is always the same value I get returned (101.5). I got the same issue with the width, it is also always set to 101.5.

I hope you can help me out.

Best regards!

4

When are you looking at that property? The documentation says that the actualBounds are only valid after the object has been measured and arranged, which is only guaranteed after a transaction has finished.

5

I am looking into the property inside
diagram.addModelChangedListener(function (e, obj) {
And I am not using any transactions in that case.
But isn’t it still weird, that there are two different values for height and width for the same object?

If I wanted to use a transaction, where should I do that?

polygonDrawingTool = new PolygonDrawingTool(); polygonDrawingTool.archetypePartData = { fill: "yellow", stroke: "blue", strokeWidth: 3, category: "PolygonDrawing" }; polygonDrawingTool.isPolygon = true; diagram.toolManager.mouseDownTools.insertAt(0, polygonDrawingTool); polygonDrawingTool.isEnabled = false;

I am using a checkbox to enable/disable the tool, but the code above is pretty much all the code for the “PolygonDrawingTool”.

6

Yes, that listener should work for model data changes, but not necessarily for diagram node changes.

You could look at the new Node’s Shape’s .geometry object – the Geometry.bounds information should be valid.

7

The polygon I just created using the “PolygonDrawingTool” has no geometry object.
diagram.findNodeForData(nodeDataArray[i]).geometry is undefined.
What do I need to do to add a geometry?

8

A Panel does not have a Geometry, only a Shape does.

That’s why I said that you had to find the Shape within the Node.