@progress/kendo-charts 2.3.0-dev.202404070723 → 2.3.0-dev.202404121620

package/dist/es/sankey/calculation.js

@@ -58,9 +58,14 @@ Sankey.prototype.calculate = function calculate () {
         var links = ref.links;
     this.connectLinksToNodes(nodes, links);
     this.calculateNodeValues(nodes);
-    this.calculateNodeDepths(nodes);
-    this.calculateNodeHeights(nodes);
 
+    var circularLinks = this.calculateNodeHeights(nodes);
+
+    if (circularLinks) {
+        return { nodes: [], links: [], columns: [], circularLinks: circularLinks };
+    }
+
+    this.calculateNodeDepths(nodes);
     var columns = this.calculateNodeColumns(nodes);
     this.calculateNodeBreadths(columns);
     this.applyNodesOffset(nodes);
@@ -118,21 +123,26 @@ Sankey.prototype.calculateNodeDepths = function calculateNodeDepths (nodes) {
 };
 
 Sankey.prototype.calculateNodeHeights = function calculateNodeHeights (nodes) {
+    var nodesLength = nodes.length;
     var current = new Set(nodes);
     var next = new Set;
-    var x = 0;
+    var currentHeight = 0;
     var eachNode = function (node) {
-        node.height = x;
+        node.height = currentHeight;
         node.targetLinks.forEach(function (link) {
             next.add(link.source);
         });
     };
     while (current.size) {
         current.forEach(eachNode);
-        x++;
+        currentHeight++;
+        if (currentHeight > nodesLength) {
+            return true;
+        }
         current = next;
         next = new Set;
     }
+    return false;
 };
 
 Sankey.prototype.calculateNodeColumns = function calculateNodeColumns (nodes) {

package/dist/es/sankey/legend.js

@@ -1,7 +1,6 @@
 import { default as ChartLegend } from "../chart/legend/legend";
 import { SankeyElement } from "./element";
 import { setDefaultOptions } from '../common';
-import { nodeColor } from "./node";
 import { BOTTOM, CENTER, POINTER } from "../common/constants";
 import { AREA } from "../chart/constants";
 
@@ -25,17 +24,16 @@ export var Legend = (function (SankeyElement) {
         var options = this.options;
         var drawingRect = options.drawingRect;
         var nodes = options.nodes; if ( nodes === void 0 ) nodes = [];
-        var colors = options.colors; if ( colors === void 0 ) colors = [];
         var item = options.item;
 
         if (options.visible === false || !nodes.length) {
             return null;
         }
 
-        var data = nodes.map(function (node, index) { return ({
+        var data = nodes.map(function (node) { return ({
             text: (node.label && node.label.text) || '',
             area: {
-                background: item.areaBackground !== undefined ? item.areaBackground : nodeColor(node, colors, index),
+                background: item.areaBackground !== undefined ? item.areaBackground : node.color,
                 opacity: item.areaOpacity !== undefined ? item.areaOpacity : node.opacity
             },
             node: node,

package/dist/es/sankey/node.js

@@ -38,12 +38,12 @@ export var Node = (function (SankeyElement) {
     return Node;
 }(SankeyElement));
 
-export var nodeColor = function (node, nodesColors, index) { return node.color || nodesColors[index % nodesColors.length]; };
+var nodeColor = function (node, nodeColors, index) { return node.color || nodeColors[index % nodeColors.length]; };
 
-export var resolveNodeOptions = function (node, options, nodesColors, index) {
+export var resolveNodeOptions = function (node, options, nodeColors, index) {
     var nodeOptions = deepExtend({}, options, options.node);
     return deepExtend({},
-        { color: nodeColor(node, nodesColors, index) },
+        { color: nodeColor(node, nodeColors, index) },
         nodeOptions,
         { node: node },
         {

package/dist/es/sankey/sankey.js

@@ -105,12 +105,21 @@ export var Sankey = (function (Observable) {
         var this$1 = this;
 
         this.linksVisuals.forEach(function (link) {
-            this$1.setOpacity(link, opacity);
+            this$1.setOpacity(link, opacity, link.linkOptions.opacity);
         });
     };
 
-    Sankey.prototype.setOpacity = function setOpacity (link, opacity) {
-        link.options.set('stroke', Object.assign({}, link.options.stroke, {opacity: opacity}));
+    Sankey.prototype.setLinksInactivityOpacity = function setLinksInactivityOpacity (inactiveOpacity) {
+        var this$1 = this;
+
+        this.linksVisuals.forEach(function (link) {
+            this$1.setOpacity(link, inactiveOpacity, link.linkOptions.highlight.inactiveOpacity);
+        });
+    };
+
+    Sankey.prototype.setOpacity = function setOpacity (link, opacity, linkValue) {
+        link.options.set('stroke', Object.assign({}, link.options.stroke,
+            {opacity: defined(linkValue) ? linkValue : opacity}));
     };
 
     Sankey.prototype.trigger = function trigger (name, ev) {
@@ -136,8 +145,8 @@ export var Sankey = (function (Observable) {
         var ref = this.options.links;
         var highlight = ref.highlight;
         if (isLink) {
-            this.setLinksOpacity(highlight.inactiveOpacity);
-            this.setOpacity(element, highlight.opacity);
+            this.setLinksInactivityOpacity(highlight.inactiveOpacity);
+            this.setOpacity(element, highlight.opacity, element.linkOptions.highlight.opacity);
         } else if (isNode) {
             this.highlightLinks(element, highlight);
         } else if (isLegendItem) {
@@ -147,6 +156,8 @@ export var Sankey = (function (Observable) {
     };
 
     Sankey.prototype._mouseleave = function _mouseleave (ev) {
+        var this$1 = this;
+
         var element = ev.element;
         var isLink = element.type === LINK;
         var isNode = element.type === NODE;
@@ -172,14 +183,16 @@ export var Sankey = (function (Observable) {
         }
 
         if (isLink || isNode || isLegendItem) {
-            this.setLinksOpacity(this.options.links.opacity);
+            this.linksVisuals.forEach(function (link) {
+                this$1.setOpacity(link, this$1.options.links.opacity, link.linkOptions.opacity);
+            });
         }
     };
 
     Sankey.prototype._mousemove = function _mousemove (ev) {
         var this$1 = this;
 
-        var ref = this.options.tooltips;
+        var ref = this.options.tooltip;
         var followPointer = ref.followPointer;
         var delay = ref.delay;
         var element = ev.element;
@@ -241,9 +254,9 @@ export var Sankey = (function (Observable) {
         var this$1 = this;
 
         if (node) {
-            this.setLinksOpacity(highlight.inactiveOpacity);
+            this.setLinksInactivityOpacity(highlight.inactiveOpacity);
             node.links.forEach(function (link) {
-                this$1.setOpacity(link, highlight.opacity);
+                this$1.setOpacity(link, highlight.opacity, link.linkOptions.highlight.opacity);
             });
         }
     };
@@ -333,7 +346,7 @@ export var Sankey = (function (Observable) {
         var data = sankeyOptions.data;
         var nodes = sankeyOptions.nodes;
         var labels = sankeyOptions.labels;
-        var nodesColors = sankeyOptions.nodesColors;
+        var nodeColors = sankeyOptions.nodeColors;
         var disableAutoLayout = sankeyOptions.disableAutoLayout;
         var autoLayout = !disableAutoLayout;
 
@@ -374,11 +387,18 @@ export var Sankey = (function (Observable) {
             }
         }
 
-        var calculatedNodes = calculateSankey(Object.assign({}, calcOptions, {offsetX: 0, offsetY: 0, width: sankeyBox.width(), height: sankeyBox.height()})).nodes;
+        var ref = calculateSankey(Object.assign({}, calcOptions, {offsetX: 0, offsetY: 0, width: sankeyBox.width(), height: sankeyBox.height()}));
+        var calculatedNodes = ref.nodes;
+        var circularLinks = ref.circularLinks;
+        if (circularLinks) {
+            console.warn('Circular links detected. Kendo Sankey diagram does not support circular links.');
+            return { sankey: { nodes: [], links: [], circularLinks: circularLinks }, legendBox: legendBox, titleBox: titleBox };
+        }
+
         var box = new Box();
 
         calculatedNodes.forEach(function (nodeEl, i) {
-            var nodeOps = resolveNodeOptions(nodeEl, nodes, nodesColors, i);
+            var nodeOps = resolveNodeOptions(nodeEl, nodes, nodeColors, i);
             var nodeInstance = new Node(nodeOps);
             box.wrap(rectToBox(nodeInstance.exportVisual().rawBBox()));
 
@@ -460,7 +480,7 @@ export var Sankey = (function (Observable) {
         var labelOptions = sankeyOptions.labels;
         var nodesOptions = sankeyOptions.nodes;
         var linkOptions = sankeyOptions.links;
-        var nodesColors = sankeyOptions.nodesColors;
+        var nodeColors = sankeyOptions.nodeColors;
         var title = sankeyOptions.title;
         var legend = sankeyOptions.legend;
         var ref = sankeyContext.size;
@@ -485,17 +505,24 @@ export var Sankey = (function (Observable) {
             visual.append(titleVisual);
         }
 
+        if (sankey.circularLinks) {
+            return visual;
+        }
+
         var visualNodes = new Map();
         sankeyContext.nodesVisuals = visualNodes;
 
         nodes.forEach(function (node, i) {
-            var nodeOps = resolveNodeOptions(node, nodesOptions, nodesColors, i);
+            var nodeOps = resolveNodeOptions(node, nodesOptions, nodeColors, i);
 
             var nodeInstance = new Node(nodeOps);
             var nodeVisual = nodeInstance.exportVisual();
             nodeVisual.links = [];
             nodeVisual.type = NODE;
 
+            node.color = nodeOps.color;
+            node.opacity = nodeOps.opacity;
+
             nodeVisual.dataItem = Object.assign({}, data.nodes[i],
                 {color: nodeOps.color,
                 opacity: nodeOps.opacity,
@@ -526,6 +553,7 @@ export var Sankey = (function (Observable) {
                 target: Object.assign({}, targetNode.dataItem),
                 value: link.value
             };
+            linkVisual.linkOptions = linkOps;
             linksVisuals.push(linkVisual);
 
             sourceNode.links.push(linkVisual);
@@ -546,7 +574,7 @@ export var Sankey = (function (Observable) {
         });
 
         if (legendBox) {
-            var legendElement = new Legend(Object.assign({}, legend, {drawingRect: legendBox, nodes: nodes, colors: nodesColors}));
+            var legendElement = new Legend(Object.assign({}, legend, {drawingRect: legendBox, nodes: nodes}));
             var legendVisual = legendElement.exportVisual();
             visual.append(legendVisual);
         }
@@ -612,7 +640,7 @@ setDefaultOptions(Sankey, {
             inactiveOpacity: 0.2
         }
     },
-    tooltips: {
+    tooltip: {
         followPointer: false,
         delay: 1000
     }

package/dist/es2015/sankey/calculation.js

@@ -55,9 +55,14 @@ class Sankey {
         const { nodes, links } = this.data;
         this.connectLinksToNodes(nodes, links);
         this.calculateNodeValues(nodes);
-        this.calculateNodeDepths(nodes);
-        this.calculateNodeHeights(nodes);
 
+        const circularLinks = this.calculateNodeHeights(nodes);
+
+        if (circularLinks) {
+            return { nodes: [], links: [], columns: [], circularLinks };
+        }
+
+        this.calculateNodeDepths(nodes);
         const columns = this.calculateNodeColumns(nodes);
         this.calculateNodeBreadths(columns);
         this.applyNodesOffset(nodes);
@@ -115,21 +120,26 @@ class Sankey {
     }
 
     calculateNodeHeights(nodes) {
+        const nodesLength = nodes.length;
         let current = new Set(nodes);
         let next = new Set;
-        let x = 0;
+        let currentHeight = 0;
         const eachNode = (node) => {
-            node.height = x;
+            node.height = currentHeight;
             node.targetLinks.forEach((link) => {
                 next.add(link.source);
             });
         };
         while (current.size) {
             current.forEach(eachNode);
-            x++;
+            currentHeight++;
+            if (currentHeight > nodesLength) {
+                return true;
+            }
             current = next;
             next = new Set;
         }
+        return false;
     }
 
     calculateNodeColumns(nodes) {

package/dist/es2015/sankey/legend.js

@@ -1,7 +1,6 @@
 import { default as ChartLegend } from "../chart/legend/legend";
 import { SankeyElement } from "./element";
 import { setDefaultOptions } from '../common';
-import { nodeColor } from "./node";
 import { BOTTOM, CENTER, POINTER } from "../common/constants";
 import { AREA } from "../chart/constants";
 
@@ -15,16 +14,16 @@ const sortData = (a, b) => {
 export class Legend extends SankeyElement {
     getElement() {
         const options = this.options;
-        const { drawingRect, nodes = [], colors = [], item } = options;
+        const { drawingRect, nodes = [], item } = options;
 
         if (options.visible === false || !nodes.length) {
             return null;
         }
 
-        const data = nodes.map((node, index) => ({
+        const data = nodes.map((node) => ({
             text: (node.label && node.label.text) || '',
             area: {
-                background: item.areaBackground !== undefined ? item.areaBackground : nodeColor(node, colors, index),
+                background: item.areaBackground !== undefined ? item.areaBackground : node.color,
                 opacity: item.areaOpacity !== undefined ? item.areaOpacity : node.opacity
             },
             node: node,

package/dist/es2015/sankey/node.js

@@ -28,12 +28,12 @@ export class Node extends SankeyElement {
     }
 }
 
-export const nodeColor = (node, nodesColors, index) => node.color || nodesColors[index % nodesColors.length];
+const nodeColor = (node, nodeColors, index) => node.color || nodeColors[index % nodeColors.length];
 
-export const resolveNodeOptions = (node, options, nodesColors, index) => {
+export const resolveNodeOptions = (node, options, nodeColors, index) => {
     const nodeOptions = deepExtend({}, options, options.node);
     return deepExtend({},
-        { color: nodeColor(node, nodesColors, index) },
+        { color: nodeColor(node, nodeColors, index) },
         nodeOptions,
         { node },
         {

package/dist/es2015/sankey/sankey.js

@@ -94,12 +94,19 @@ export class Sankey extends Observable {
 
     setLinksOpacity(opacity) {
         this.linksVisuals.forEach(link => {
-            this.setOpacity(link, opacity);
+            this.setOpacity(link, opacity, link.linkOptions.opacity);
         });
     }
 
-    setOpacity(link, opacity) {
-        link.options.set('stroke', Object.assign({}, link.options.stroke, {opacity}));
+    setLinksInactivityOpacity(inactiveOpacity) {
+        this.linksVisuals.forEach(link => {
+            this.setOpacity(link, inactiveOpacity, link.linkOptions.highlight.inactiveOpacity);
+        });
+    }
+
+    setOpacity(link, opacity, linkValue) {
+        link.options.set('stroke', Object.assign({}, link.options.stroke,
+            {opacity: defined(linkValue) ? linkValue : opacity}));
     }
 
     trigger(name, ev) {
@@ -124,8 +131,8 @@ export class Sankey extends Observable {
 
         const { highlight } = this.options.links;
         if (isLink) {
-            this.setLinksOpacity(highlight.inactiveOpacity);
-            this.setOpacity(element, highlight.opacity);
+            this.setLinksInactivityOpacity(highlight.inactiveOpacity);
+            this.setOpacity(element, highlight.opacity, element.linkOptions.highlight.opacity);
         } else if (isNode) {
             this.highlightLinks(element, highlight);
         } else if (isLegendItem) {
@@ -160,12 +167,14 @@ export class Sankey extends Observable {
         }
 
         if (isLink || isNode || isLegendItem) {
-            this.setLinksOpacity(this.options.links.opacity);
+            this.linksVisuals.forEach(link => {
+                this.setOpacity(link, this.options.links.opacity, link.linkOptions.opacity);
+            });
         }
     }
 
     _mousemove(ev) {
-        const { followPointer, delay } = this.options.tooltips;
+        const { followPointer, delay } = this.options.tooltip;
         const element = ev.element;
         const tooltipElType = element.type;
 
@@ -221,9 +230,9 @@ export class Sankey extends Observable {
 
     highlightLinks(node, highlight) {
         if (node) {
-            this.setLinksOpacity(highlight.inactiveOpacity);
+            this.setLinksInactivityOpacity(highlight.inactiveOpacity);
             node.links.forEach(link => {
-                this.setOpacity(link, highlight.opacity);
+                this.setOpacity(link, highlight.opacity, link.linkOptions.highlight.opacity);
             });
         }
     }
@@ -306,7 +315,7 @@ export class Sankey extends Observable {
     }
 
     calculateSankey(calcOptions, sankeyOptions) {
-        const { title, legend, data, nodes, labels, nodesColors, disableAutoLayout } = sankeyOptions;
+        const { title, legend, data, nodes, labels, nodeColors, disableAutoLayout } = sankeyOptions;
         const autoLayout = !disableAutoLayout;
 
         const sankeyBox = new Box(0, 0, calcOptions.width, calcOptions.height);
@@ -346,11 +355,16 @@ export class Sankey extends Observable {
             }
         }
 
-        const calculatedNodes = calculateSankey(Object.assign({}, calcOptions, {offsetX: 0, offsetY: 0, width: sankeyBox.width(), height: sankeyBox.height()})).nodes;
+        const { nodes: calculatedNodes, circularLinks } = calculateSankey(Object.assign({}, calcOptions, {offsetX: 0, offsetY: 0, width: sankeyBox.width(), height: sankeyBox.height()}));
+        if (circularLinks) {
+            console.warn('Circular links detected. Kendo Sankey diagram does not support circular links.');
+            return { sankey: { nodes: [], links: [], circularLinks }, legendBox, titleBox };
+        }
+
         const box = new Box();
 
         calculatedNodes.forEach((nodeEl, i) => {
-            const nodeOps = resolveNodeOptions(nodeEl, nodes, nodesColors, i);
+            const nodeOps = resolveNodeOptions(nodeEl, nodes, nodeColors, i);
             const nodeInstance = new Node(nodeOps);
             box.wrap(rectToBox(nodeInstance.exportVisual().rawBBox()));
 
@@ -428,7 +442,7 @@ export class Sankey extends Observable {
         const sankeyOptions = options || this.options;
         const sankeyContext = context || this;
 
-        const { data, labels: labelOptions, nodes: nodesOptions, links: linkOptions, nodesColors, title, legend } = sankeyOptions;
+        const { data, labels: labelOptions, nodes: nodesOptions, links: linkOptions, nodeColors, title, legend } = sankeyOptions;
         const { width, height } = sankeyContext.size;
 
         const calcOptions = Object.assign({}, data, {width, height, nodesOptions, title, legend});
@@ -445,17 +459,24 @@ export class Sankey extends Observable {
             visual.append(titleVisual);
         }
 
+        if (sankey.circularLinks) {
+            return visual;
+        }
+
         const visualNodes = new Map();
         sankeyContext.nodesVisuals = visualNodes;
 
         nodes.forEach((node, i) => {
-            const nodeOps = resolveNodeOptions(node, nodesOptions, nodesColors, i);
+            const nodeOps = resolveNodeOptions(node, nodesOptions, nodeColors, i);
 
             const nodeInstance = new Node(nodeOps);
             const nodeVisual = nodeInstance.exportVisual();
             nodeVisual.links = [];
             nodeVisual.type = NODE;
 
+            node.color = nodeOps.color;
+            node.opacity = nodeOps.opacity;
+
             nodeVisual.dataItem = Object.assign({}, data.nodes[i],
                 {color: nodeOps.color,
                 opacity: nodeOps.opacity,
@@ -485,6 +506,7 @@ export class Sankey extends Observable {
                 target: Object.assign({}, targetNode.dataItem),
                 value: link.value
             };
+            linkVisual.linkOptions = linkOps;
             linksVisuals.push(linkVisual);
 
             sourceNode.links.push(linkVisual);
@@ -505,7 +527,7 @@ export class Sankey extends Observable {
         });
 
         if (legendBox) {
-            const legendElement = new Legend(Object.assign({}, legend, {drawingRect: legendBox, nodes, colors: nodesColors}));
+            const legendElement = new Legend(Object.assign({}, legend, {drawingRect: legendBox, nodes}));
             const legendVisual = legendElement.exportVisual();
             visual.append(legendVisual);
         }
@@ -569,7 +591,7 @@ setDefaultOptions(Sankey, {
             inactiveOpacity: 0.2
         }
     },
-    tooltips: {
+    tooltip: {
         followPointer: false,
         delay: 1000
     }