egon.io

egon.io copied to clipboard

Describe the bug when export to html, the svg viewbox is too small to show the activity info

To Reproduce

just export html

Expected behavior the activity and workobjects can be seen in slides Screenshots before change:

after change:

Desktop (please complete the following information):

• Modeler Version: v0.4.0
• Browser: [e.g. chrome 71.0]
• OS: [e.g. Windows 10]

Additional context here is a quick fix, just copy code from app/domain-story-modeler/features/export/svgDownload.js to app/domain-story-modeler/features/export/storyDownload.js the html view is complete after change

diff --git a/app/domain-story-modeler/features/export/storyDownload.js b/app/domain-story-modeler/features/export/storyDownload.js
index 0a12b5e..43651f7 100644
--- a/app/domain-story-modeler/features/export/storyDownload.js
+++ b/app/domain-story-modeler/features/export/storyDownload.js
@@ -202,16 +202,17 @@ function createSVGData(svg) {
   // we change the confines of the SVG viewbox
   let viewBoxIndex = data.indexOf('width="');
 
-  let viewBox = viewBoxCoordinates(data);
+  // let viewBox = viewBoxCoordinates(data);
+  let { width, height, viewBox } = viewBoxCoordinates(data);
 
-  let xLeft, width, yUp, height;
+  let xLeft, yUp;
   let bounds = '';
   let splitViewBox = viewBox.split(/\s/);
 
   xLeft = +splitViewBox[0];
   yUp = +splitViewBox[1];
-  width = +splitViewBox[2];
-  height = +splitViewBox[3];
+  width = +splitViewBox[2]+300;
+  height = +splitViewBox[3]+300;
 
   if (width < 300) {
     width += 300;
@@ -249,7 +250,7 @@ function createSVGData(svg) {
 function viewBoxCoordinates(svg) {
   const ViewBoxCoordinate = /width="([^"]+)"\s+height="([^"]+)"\s+viewBox="([^"]+)"/;
   const match = svg.match(ViewBoxCoordinate);
-  return match[3];
+  return { width: +match[1], height: +match[2], viewBox: match[3] };
 }
 
 
@@ -270,4 +271,4 @@ function fixSvgDefinitions(result, sectionIndex) {
   }
 
   result.svg = result.svg.replace(defs, newDefs);
-}
\ No newline at end of file
+}

I guess it's the same issue as the following, right? I exported it as HTML page in Version 1.5.0. The working object connect that is connected with the Actor by the arrow (04) is not visible in the viewbox of the HTML page in the step where it's added to the story. In the step 05 it's visible since the view has zoomed out a bit.

Remarks: The lower border is the bottom side of by webbrowser.

If it's the same issue, could you provide your fix via a Pull Request?

@apae89 Fixed in v2.

@ruanwz Cant reproduce it. Can you provide an example?