@progress/kendo-charts 2.3.0-dev.202402161236 → 2.3.0-dev.202402161315

package/dist/es/sankey/sankey.js

@@ -1,4 +1,4 @@
-import { drawing } from '@progress/kendo-drawing';
+import { geometry, drawing } from '@progress/kendo-drawing';
 import { deepExtend, addClass, setDefaultOptions } from '../common';
 import { calculateSankey } from './calculation';
 import { Node, resolveNodeOptions } from './node';
@@ -10,6 +10,7 @@ import Box from '../core/box';
 import rectToBox from '../core/utils/rect-to-box';
 import { Observable } from '../common/observable';
 import { Legend } from './legend';
+import { defined } from '../drawing-utils';
 
 var LINK = 'link';
 var NODE = 'node';
@@ -257,17 +258,15 @@ export var Sankey = (function (Observable) {
         return legendVisual.chartElement.box;
     };
 
-    Sankey.prototype.calculateSankey = function calculateSankey$1 (options) {
-        var ref = this.options;
-        var title = ref.title;
-        var legend = ref.legend;
-        var data = ref.data;
-        var ref$1 = this.options;
-        var nodes = ref$1.nodes;
-        var labels = ref$1.labels;
-        var nodesColors = ref$1.nodesColors;
-
-        var sankeyBox = new Box(0, 0, options.width, options.height);
+    Sankey.prototype.calculateSankey = function calculateSankey$1 (calcOptions, sankeyOptions) {
+        var title = sankeyOptions.title;
+        var legend = sankeyOptions.legend;
+        var data = sankeyOptions.data;
+        var nodes = sankeyOptions.nodes;
+        var labels = sankeyOptions.labels;
+        var nodesColors = sankeyOptions.nodesColors;
+
+        var sankeyBox = new Box(0, 0, calcOptions.width, calcOptions.height);
         var titleBox = this.titleBox(title, sankeyBox);
 
         var legendArea = sankeyBox.clone();
@@ -276,10 +275,10 @@ export var Sankey = (function (Observable) {
             var titleHeight = titleBox.height();
             if (title.position === TOP) {
                 sankeyBox.unpad({ top: titleHeight });
-                legendArea = new Box(0, titleHeight, options.width, options.height);
+                legendArea = new Box(0, titleHeight, calcOptions.width, calcOptions.height);
             } else {
                 sankeyBox.shrink(0, titleHeight);
-                legendArea = new Box(0, 0, options.width, options.height - titleHeight);
+                legendArea = new Box(0, 0, calcOptions.width, calcOptions.height - titleHeight);
             }
         }
 
@@ -303,7 +302,7 @@ export var Sankey = (function (Observable) {
             }
         }
 
-        var calculatedNodes = calculateSankey(Object.assign({}, options, {offsetX: sankeyBox.x1, offsetY: sankeyBox.y1, width: sankeyBox.x2, height: sankeyBox.y2})).nodes;
+        var calculatedNodes = calculateSankey(Object.assign({}, calcOptions, {offsetX: sankeyBox.x1, offsetY: sankeyBox.y1, width: sankeyBox.x2, height: sankeyBox.y2})).nodes;
         var box = new Box();
 
         calculatedNodes.forEach(function (nodeEl, i) {
@@ -311,7 +310,7 @@ export var Sankey = (function (Observable) {
             var nodeInstance = new Node(nodeOps);
             box.wrap(rectToBox(nodeInstance.exportVisual().rawBBox()));
 
-            var labelInstance = new Label(deepExtend({ node: nodeEl, totalWidth: options.width }, labels));
+            var labelInstance = new Label(deepExtend({ node: nodeEl, totalWidth: calcOptions.width }, labels));
             var labelVisual = labelInstance.exportVisual();
             if (labelVisual) {
                 box.wrap(rectToBox(labelVisual.rawBBox()));
@@ -325,33 +324,38 @@ export var Sankey = (function (Observable) {
         var height = box.height() > sankeyBox.y2 ? offsetY + sankeyBox.y2 - (box.height() - sankeyBox.y2) : sankeyBox.y2;
 
         return {
-            sankey: calculateSankey(Object.assign({}, options, {offsetX: offsetX, offsetY: offsetY, width: width, height: height})),
+            sankey: calculateSankey(Object.assign({}, calcOptions, {offsetX: offsetX, offsetY: offsetY, width: width, height: height})),
             legendBox: legendBox,
             titleBox: titleBox
         };
     };
 
-    Sankey.prototype._render = function _render () {
-        var ref = this.options;
-        var data = ref.data;
-        var labelOptions = ref.labels;
-        var nodesOptions = ref.nodes;
-        var linkOptions = ref.links;
-        var nodesColors = ref.nodesColors;
-        var title = ref.title;
-        var legend = ref.legend;
-        var ref$1 = this.size;
-        var width = ref$1.width;
-        var height = ref$1.height;
+    Sankey.prototype._render = function _render (options, context) {
+        var sankeyOptions = options || this.options;
+        var sankeyContext = context || this;
+
+        var data = sankeyOptions.data;
+        var labelOptions = sankeyOptions.labels;
+        var nodesOptions = sankeyOptions.nodes;
+        var linkOptions = sankeyOptions.links;
+        var nodesColors = sankeyOptions.nodesColors;
+        var title = sankeyOptions.title;
+        var legend = sankeyOptions.legend;
+        var ref = sankeyContext.size;
+        var width = ref.width;
+        var height = ref.height;
+
         var calcOptions = Object.assign({}, data, {width: width, height: height, nodesOptions: nodesOptions, title: title, legend: legend});
-        var ref$2 = this.calculateSankey(calcOptions);
-        var sankey = ref$2.sankey;
-        var titleBox = ref$2.titleBox;
-        var legendBox = ref$2.legendBox;
+        var ref$1 = this.calculateSankey(calcOptions, sankeyOptions);
+        var sankey = ref$1.sankey;
+        var titleBox = ref$1.titleBox;
+        var legendBox = ref$1.legendBox;
         var nodes = sankey.nodes;
         var links = sankey.links;
 
-        var visual = new drawing.Group();
+        var visual = new drawing.Group({
+            clip: drawing.Path.fromRect(new geometry.Rect([0, 0], [width, height]))
+        });
 
         if (titleBox) {
             var titleElement = new Title(Object.assign({}, title, {drawingRect: titleBox}));
@@ -366,6 +370,7 @@ export var Sankey = (function (Observable) {
         }
 
         var visualNodes = new Map();
+        sankeyContext.nodesVisuals = visualNodes;
 
         nodes.forEach(function (node, i) {
             var nodeOps = resolveNodeOptions(node, nodesOptions, nodesColors, i);
@@ -388,6 +393,7 @@ export var Sankey = (function (Observable) {
         var sortedLinks = links.slice().sort(function (a, b) { return b.value - a.value; });
 
         var linksVisuals = [];
+        sankeyContext.linksVisuals = linksVisuals;
 
         sortedLinks.forEach(function (link) {
             var source = link.source;
@@ -412,9 +418,6 @@ export var Sankey = (function (Observable) {
             visual.append(linkVisual);
         });
 
-        this.linksVisuals = linksVisuals;
-        this.nodesVisuals = visualNodes;
-
         nodes.forEach(function (node) {
             var textOps = resolveLabelOptions(node, labelOptions, width);
             var labelInstance = new Label(textOps);
@@ -428,8 +431,18 @@ export var Sankey = (function (Observable) {
         return visual;
     };
 
-    Sankey.prototype.exportVisual = function exportVisual () {
-        return this._render();
+    Sankey.prototype.exportVisual = function exportVisual (exportOptions) {
+        var options = (exportOptions && exportOptions.options) ?
+            deepExtend({}, this.options, exportOptions.options) : this.options;
+
+        var context = {
+            size: {
+                width: defined(exportOptions && exportOptions.width) ? exportOptions.width : this.size.width,
+                height: defined(exportOptions && exportOptions.height) ? exportOptions.height : this.size.height
+            }
+        };
+
+        return this._render(options, context);
     };
 
     Sankey.prototype._setOptions = function _setOptions (options) {

package/dist/es2015/sankey/sankey.js

@@ -1,4 +1,4 @@
-import { drawing } from '@progress/kendo-drawing';
+import { geometry, drawing } from '@progress/kendo-drawing';
 import { deepExtend, addClass, setDefaultOptions } from '../common';
 import { calculateSankey } from './calculation';
 import { Node, resolveNodeOptions } from './node';
@@ -10,6 +10,7 @@ import Box from '../core/box';
 import rectToBox from '../core/utils/rect-to-box';
 import { Observable } from '../common/observable';
 import { Legend } from './legend';
+import { defined } from '../drawing-utils';
 
 const LINK = 'link';
 const NODE = 'node';
@@ -242,11 +243,10 @@ export class Sankey extends Observable {
         return legendVisual.chartElement.box;
     }
 
-    calculateSankey(options) {
-        const { title, legend, data } = this.options;
-        const { nodes, labels, nodesColors } = this.options;
+    calculateSankey(calcOptions, sankeyOptions) {
+        const { title, legend, data, nodes, labels, nodesColors } = sankeyOptions;
 
-        const sankeyBox = new Box(0, 0, options.width, options.height);
+        const sankeyBox = new Box(0, 0, calcOptions.width, calcOptions.height);
         const titleBox = this.titleBox(title, sankeyBox);
 
         let legendArea = sankeyBox.clone();
@@ -255,10 +255,10 @@ export class Sankey extends Observable {
             const titleHeight = titleBox.height();
             if (title.position === TOP) {
                 sankeyBox.unpad({ top: titleHeight });
-                legendArea = new Box(0, titleHeight, options.width, options.height);
+                legendArea = new Box(0, titleHeight, calcOptions.width, calcOptions.height);
             } else {
                 sankeyBox.shrink(0, titleHeight);
-                legendArea = new Box(0, 0, options.width, options.height - titleHeight);
+                legendArea = new Box(0, 0, calcOptions.width, calcOptions.height - titleHeight);
             }
         }
 
@@ -282,7 +282,7 @@ export class Sankey extends Observable {
             }
         }
 
-        const calculatedNodes = calculateSankey(Object.assign({}, options, {offsetX: sankeyBox.x1, offsetY: sankeyBox.y1, width: sankeyBox.x2, height: sankeyBox.y2})).nodes;
+        const calculatedNodes = calculateSankey(Object.assign({}, calcOptions, {offsetX: sankeyBox.x1, offsetY: sankeyBox.y1, width: sankeyBox.x2, height: sankeyBox.y2})).nodes;
         const box = new Box();
 
         calculatedNodes.forEach((nodeEl, i) => {
@@ -290,7 +290,7 @@ export class Sankey extends Observable {
             const nodeInstance = new Node(nodeOps);
             box.wrap(rectToBox(nodeInstance.exportVisual().rawBBox()));
 
-            const labelInstance = new Label(deepExtend({ node: nodeEl, totalWidth: options.width }, labels));
+            const labelInstance = new Label(deepExtend({ node: nodeEl, totalWidth: calcOptions.width }, labels));
             const labelVisual = labelInstance.exportVisual();
             if (labelVisual) {
                 box.wrap(rectToBox(labelVisual.rawBBox()));
@@ -304,20 +304,26 @@ export class Sankey extends Observable {
         let height = box.height() > sankeyBox.y2 ? offsetY + sankeyBox.y2 - (box.height() - sankeyBox.y2) : sankeyBox.y2;
 
         return {
-            sankey: calculateSankey(Object.assign({}, options, {offsetX, offsetY, width, height})),
+            sankey: calculateSankey(Object.assign({}, calcOptions, {offsetX, offsetY, width, height})),
             legendBox,
             titleBox
         };
     }
 
-    _render() {
-        const { data, labels: labelOptions, nodes: nodesOptions, links: linkOptions, nodesColors, title, legend } = this.options;
-        const { width, height } = this.size;
+    _render(options, context) {
+        const sankeyOptions = options || this.options;
+        const sankeyContext = context || this;
+
+        const { data, labels: labelOptions, nodes: nodesOptions, links: linkOptions, nodesColors, title, legend } = sankeyOptions;
+        const { width, height } = sankeyContext.size;
+
         const calcOptions = Object.assign({}, data, {width, height, nodesOptions, title, legend});
-        const { sankey, titleBox, legendBox } = this.calculateSankey(calcOptions);
+        const { sankey, titleBox, legendBox } = this.calculateSankey(calcOptions, sankeyOptions);
         const { nodes, links } = sankey;
 
-        const visual = new drawing.Group();
+        const visual = new drawing.Group({
+            clip: drawing.Path.fromRect(new geometry.Rect([0, 0], [width, height]))
+        });
 
         if (titleBox) {
             const titleElement = new Title(Object.assign({}, title, {drawingRect: titleBox}));
@@ -332,6 +338,7 @@ export class Sankey extends Observable {
         }
 
         const visualNodes = new Map();
+        sankeyContext.nodesVisuals = visualNodes;
 
         nodes.forEach((node, i) => {
             const nodeOps = resolveNodeOptions(node, nodesOptions, nodesColors, i);
@@ -354,6 +361,7 @@ export class Sankey extends Observable {
         const sortedLinks = links.slice().sort((a, b) => b.value - a.value);
 
         const linksVisuals = [];
+        sankeyContext.linksVisuals = linksVisuals;
 
         sortedLinks.forEach(link => {
             const { source, target } = link;
@@ -377,9 +385,6 @@ export class Sankey extends Observable {
             visual.append(linkVisual);
         });
 
-        this.linksVisuals = linksVisuals;
-        this.nodesVisuals = visualNodes;
-
         nodes.forEach((node) => {
             const textOps = resolveLabelOptions(node, labelOptions, width);
             const labelInstance = new Label(textOps);
@@ -393,8 +398,18 @@ export class Sankey extends Observable {
         return visual;
     }
 
-    exportVisual() {
-        return this._render();
+    exportVisual(exportOptions) {
+        const options = (exportOptions && exportOptions.options) ?
+            deepExtend({}, this.options, exportOptions.options) : this.options;
+
+        const context = {
+            size: {
+                width: defined(exportOptions && exportOptions.width) ? exportOptions.width : this.size.width,
+                height: defined(exportOptions && exportOptions.height) ? exportOptions.height : this.size.height
+            }
+        };
+
+        return this._render(options, context);
     }
 
     _setOptions(options) {