How to Flip the Panel in Horizontal/Vertically

GoJS
1

In this sample SVG Tiger Drawing in GoJS, a panel contains multiple shapes. Can you tell me how to flip the this panel in horizontal way?

2

There is no easy way to do this in general for every kind of Panel.

However, one can flip Shapes by flipping their Geometries by calling Geometry.scale. And because the Tiger sample uses a “Position” Panel, you can just translate the Shapes in the Panel by calling Geometry.offset.

Here is the updated code:

      // convert the path data string into a go.Geometry
      var data = path.getAttribute("d");
      if (typeof data === "string") shape.geometry = go.Geometry.parse(data, true).scale(-1, 1).offset(1000, 0);

Just remember that this technique doesn’t work for most kinds of Panels. And you’ll need to figure out the appropriate value for the offset. In this case, 1000 is actually a bit too big.

3

One more thing, How to get this tiger shape’s geometry string from panel once the node is added to diagram. One way is using go.Panel.findObject. But this applicable only for one shape in the panel. But I need to get the final geometry string(which contains all shape’s geometry) from node?

4

Maybe something like:

shape.geometry = shape.geometry.copy().scale(-1, 1).offset(1000, 0);

But you need to use the width of the whole panel and alternately negate it.