Difference in diagram.makeSvg rendering vs canvas and diagram.makeImage

Hi,

I’ve found that PathSegment arcs that go CCW draw correctly (IMO) on the canvas and when using diagram.makeImage but not when using diagram.makeSvg. I’ve seen this on 1.7.29 and 1.8.16. Chrome & Edge.

A very stripped-down version of the code looks like below, where I draw the arc in 2 segments, on either side of zero degrees:

  fig = new go.PathFigure(radius, 0, false);
  fig.add(new go.PathSegment(go.PathSegment.Arc, 0, deg, 0, 0, radius, radius));
  geo.add(fig);
  fig = new go.PathFigure(radius, 0, false);
  fig.add(new go.PathSegment(go.PathSegment.Arc, 0, -deg, 0, 0, radius, radius));
  geo.add(fig);

}

geo.normalize();
shape.geometry = geo;

That produces an image like this when it’s on the canvas or rendered via diagram.makeImage:

When rendered with diagram.makeSvg, the 2nd path segment takes the long way around and produces something like this:

The origin of this is that the GoJS app we built for a client does not show very good quality when the print images are generated with makeImage - and there doesn’t seem to be any way to increase the DPI. Changing to makeSvg makes very, very nice images but has this rendering bug.

Is there any chance that this will be fixed in the near(ish) future?

(edit: sorry - just realized I posted 270-degree rotated pictures…)

Thanks, we’ll look into this and get back to you.

Thanks for reporting the bug. Could you try out the library that is currently at GoJS - Build Interactive Diagrams for the Web to see it works better for you?

If it does, we could release it as “latest” pretty soon.

Yes - that does the trick! Thanks for the quick response!