fix rotate=90 graph attribute does not set the rotation during transi…

…tion

Second and final fix that fixes
#251 originally reported
as https://github.com/magjac/graphviz-visual-editor/issues/214.

CHANGELOG.md

@@ -6,6 +6,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+### Fixed
+* rotate=90 graph attribute does not set the rotation #251
+
 ## [5.6.0] – 2024-08-18
 
 ### Changed

src/element.js

@@ -27,11 +27,13 @@ export function extractElementData(element) {
             // drawing orientation is portrait
             datum.translation = { x: matrix.e, y: matrix.f };
             datum.scale = matrix.a;
+            datum.rotation = 0;
         }
         else {
             // drawing orientation is landscape
             datum.translation = { x: matrix.e, y: matrix.f };
             datum.scale = matrix.c;
+            datum.rotation = -90;
         }
     }
     if (tag == 'ellipse') {

src/graphviz.js

@@ -138,6 +138,7 @@ export function Graphviz(selection, options) {
     this._images = [];
     this._translation = undefined;
     this._scale = undefined;
+    this._rotation = undefined;
     this._eventTypes = [
         'initEnd',
         'start',

src/render.js

@@ -289,8 +289,9 @@ function _render(callback) {
                                         .tween("attr.transform", function() {
                                             var node = this;
                                             return function (t) {
-                                                const fromTransform = zoomTransform(graphvizInstance._zoomSelection.node()).toString();
-                                                const toTransform = getTranslatedZoomTransform.call(graphvizInstance, element).toString();
+                                                const rotateStr = ` rotate(${data.rotation})`;
+                                                const fromTransform = zoomTransform(graphvizInstance._zoomSelection.node()).toString() + rotateStr;
+                                                const toTransform = getTranslatedZoomTransform.call(graphvizInstance, element).toString() + rotateStr;
                                                 const interpolationFunction = interpolateTransformSvg(fromTransform, toTransform);
                                                 node.setAttribute("transform", interpolationFunction(t));
                                             };

test/dot-data-test.js

@@ -69,6 +69,7 @@ var basic_data = {
                 "y": 112
             },
             "scale": 1,
+            "rotation": 0,
             "parent": "[Circular ~]",
             "children": [
                 {

test/zoom-rotation-test.js

@@ -1,6 +1,5 @@
 import assert from "assert";
 import it from "./it.js";
-import { it_xfail } from "./it.js";
 import jsdom from "./jsdom.js";
 import * as d3_graphviz from "../index.js";
 import * as d3_transition from "d3-transition";
@@ -180,7 +179,7 @@ it("resetZoom resets the zoom transform to the original transform of the latest
 
 });
 
-it_xfail("zooming rescales transforms during transitions when rotate=90.", async () => {
+it("zooming rescales transforms during transitions when rotate=90.", async () => {
     var window = global.window = jsdom('<div id="graph"></div>');
     global.document = window.document;
     var graphviz;