[#23] collapsable tree chart resize correction

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@daryl110/go-chart",
-  "version": "1.2.4",
+  "version": "1.2.5",
   "description": "library to easily build charts",
   "main": "index.js",
   "author": "daryl110",

src/modules/d3/charts/collapsableTree.chart.js

@@ -134,21 +134,24 @@ module.exports = (
 
         let left = root;
         let right = root;
+
         root.eachBefore(node => {
             if (node.x < left.x) left = node;
             if (node.x > right.x) right = node;
         });
 
+        const height1 = right.x - left.x + margin.top + margin.bottom;
+
         const transition = svg.transition()
             .duration(duration)
-            .attr('viewBox', [-margin.left, left.x - margin.top, width, height])
-            .tween('resize', window.ResizeObserver ? null : () => () => svg.dispatch('toggle'));
+            .attr('viewBox', [-margin.left, left.x - margin.top, width, height1])
+            .tween('resize', window.ResizeObserver ? null : () => svg.dispatch('toggle'));
 
         const node = gNode.selectAll('g')
             .data(nodes, d => d.id);
 
         const nodeEnter = node.enter().append('g')
-            .attr('transform', d => `translate(${source.y0},${source.x0})`)
+            .attr('transform', () => `translate(${source.y0},${source.x0})`)
             .attr('fill-opacity', 0)
             .attr('stroke-opacity', 0)
             .on('click', d => {
@@ -177,26 +180,26 @@ module.exports = (
             .attr('stroke-opacity', 1);
 
         node.exit().transition(transition).remove()
-            .attr('transform', d => `translate(${source.y},${source.x})`)
+            .attr('transform', () => `translate(${source.y},${source.x})`)
             .attr('fill-opacity', 0)
             .attr('stroke-opacity', 0);
 
         const link = gLink.selectAll('path')
             .data(links, d => d.target.id);
 
         const linkEnter = link.enter().append('path')
-            .attr('d', d => {
-                const o = {x: source.x0, y: source.y0};
-                return diagonal({source: o, target: o});
+            .attr('d', () => {
+                const o = { x: source.x0, y: source.y0 };
+                return diagonal({ source: o, target: o });
             });
 
         link.merge(linkEnter).transition(transition)
             .attr('d', diagonal);
 
         link.exit().transition(transition).remove()
             .attr('d', () => {
-                const o = {x: source.x, y: source.y};
-                return diagonal({source: o, target: o});
+                const o = { x: source.x, y: source.y };
+                return diagonal({ source: o, target: o });
             });
 
         root.eachBefore(d => {