@visactor/vchart 1.11.0-alpha.1 → 1.11.0-alpha.3

package/esm/series/sankey/sankey.js

@@ -20,7 +20,7 @@ import { STATE_VALUE_ENUM } from "../../compile/mark/interface";
 
 import { DataView } from "@visactor/vdataset";
 
-import { LayoutZIndex, AttributeLevel, Event_Bubble_Level, DEFAULT_DATA_INDEX } from "../../constant";
+import { LayoutZIndex, AttributeLevel, Event_Bubble_Level } from "../../constant";
 
 import { SeriesData } from "../base/series-data";
 
@@ -58,26 +58,25 @@ export class SankeySeries extends CartesianSeries {
             const element = params.item;
             element && element.mark.id().includes("node") ? this._handleNodeRelatedClick(element) : element && element.mark.id().includes("link") ? this._handleLinkRelatedClick(element) : this._handleClearEmpty();
         }, this._handleClearEmpty = () => {
-            const nodeVGrammarMark = this._nodeMark.getProduct();
-            if (!nodeVGrammarMark || !nodeVGrammarMark.elements || !nodeVGrammarMark.elements.length) return;
-            const allNodeElements = nodeVGrammarMark.elements, linkVGrammarMark = this._linkMark.getProduct();
-            if (!linkVGrammarMark || !linkVGrammarMark.elements || !linkVGrammarMark.elements.length) return;
-            const allLinkElements = linkVGrammarMark.elements, labelVGrammarMark = this._labelMark.getProduct();
-            if (!labelVGrammarMark || !labelVGrammarMark.elements || !labelVGrammarMark.elements.length) return;
-            const allLabelElements = labelVGrammarMark.elements;
-            allNodeElements.forEach((el => {
+            var _a, _b, _c;
+            const allNodeElements = null === (_a = this._nodeMark) || void 0 === _a ? void 0 : _a.getProductElements();
+            if (!allNodeElements || !allNodeElements.length) return;
+            const allLinkElements = null === (_b = this._linkMark) || void 0 === _b ? void 0 : _b.getProductElements();
+            if (!allLinkElements || !allLinkElements.length) return;
+            const allLabelElements = null === (_c = this._labelMark) || void 0 === _c ? void 0 : _c.getProductElements();
+            allLabelElements && allLabelElements.length && (allNodeElements.forEach((el => {
                 el.clearStates();
             })), allLinkElements.forEach((el => {
                 el.clearStates();
             })), allLabelElements.forEach((el => {
                 el.clearStates();
-            }));
+            })));
         }, this._handleNodeAdjacencyClick = element => {
             const nodeDatum = element.getDatum(), highlightNodes = [ nodeDatum.key ];
             if (this._linkMark) {
-                const vGrammarMark = this._linkMark.getProduct();
-                if (!vGrammarMark || !vGrammarMark.elements || !vGrammarMark.elements.length) return;
-                vGrammarMark.elements.forEach(((linkEl, i) => {
+                const allLinkElements = this._linkMark.getProductElements();
+                if (!allLinkElements || !allLinkElements.length) return;
+                allLinkElements.forEach(((linkEl, i) => {
                     linkEl.clearStates();
                     const linkDatum = linkEl.getDatum(), father = (null == linkDatum ? void 0 : linkDatum.parents) ? "parents" : "source";
                     if (array(linkDatum[father]).includes(nodeDatum.key)) {
@@ -94,52 +93,27 @@ export class SankeySeries extends CartesianSeries {
                     } else linkDatum.target === nodeDatum.key ? highlightNodes.includes(linkDatum.source) || highlightNodes.push(linkDatum.source) : linkEl.useStates([ "blur" ]);
                 }));
             }
-            if (this._nodeMark) {
-                const vGrammarMark = this._nodeMark.getProduct();
-                if (!vGrammarMark || !vGrammarMark.elements || !vGrammarMark.elements.length) return;
-                vGrammarMark.elements.forEach((el => {
-                    el.clearStates(), highlightNodes.includes(el.getDatum().key) || el.useStates([ "blur" ]);
-                }));
-            }
-            if (this._labelMark) {
-                const vGrammarMark = this._labelMark.getProduct();
-                if (!vGrammarMark || !vGrammarMark.elements || !vGrammarMark.elements.length) return;
-                vGrammarMark.elements.forEach((el => {
-                    el.clearStates(), highlightNodes.includes(el.getDatum().key) || el.useStates([ "blur" ]);
-                }));
-            }
+            this._nodeMark && this._highLightElements(this._nodeMark.getProductElements(), highlightNodes), 
+            this._labelMark && this._highLightElements(this._labelMark.getProductElements(), highlightNodes);
         }, this._handleLinkAdjacencyClick = element => {
             const curLinkDatum = element.getDatum(), highlightNodes = [ curLinkDatum.source, curLinkDatum.target ];
             if (this._linkMark) {
-                const vGrammarMark = this._linkMark.getProduct();
-                if (!vGrammarMark || !vGrammarMark.elements || !vGrammarMark.elements.length) return;
-                vGrammarMark.elements.forEach((linkEl => {
+                const allLinkElements = this._linkMark.getProductElements();
+                if (!allLinkElements || !allLinkElements.length) return;
+                allLinkElements.forEach((linkEl => {
                     linkEl.clearStates(), linkEl === element ? linkEl.addState("selected", {
                         ratio: 1
                     }) : linkEl.useStates([ "blur" ]);
                 }));
             }
-            if (this._nodeMark) {
-                const vGrammarMark = this._nodeMark.getProduct();
-                if (!vGrammarMark || !vGrammarMark.elements || !vGrammarMark.elements.length) return;
-                vGrammarMark.elements.forEach((el => {
-                    el.clearStates(), highlightNodes.includes(el.getDatum().key) || el.useStates([ "blur" ]);
-                }));
-            }
-            if (this._labelMark) {
-                const vGrammarMark = this._labelMark.getProduct();
-                if (!vGrammarMark || !vGrammarMark.elements || !vGrammarMark.elements.length) return;
-                vGrammarMark.elements.forEach((el => {
-                    el.clearStates(), highlightNodes.includes(el.getDatum().key) || el.useStates([ "blur" ]);
-                }));
-            }
+            this._nodeMark && this._highLightElements(this._nodeMark.getProductElements(), highlightNodes), 
+            this._labelMark && this._highLightElements(this._labelMark.getProductElements(), highlightNodes);
         }, this._handleNodeRelatedClick = element => {
             var _a;
-            const nodeDatum = element.getDatum(), nodeVGrammarMark = this._nodeMark.getProduct();
-            if (!nodeVGrammarMark || !nodeVGrammarMark.elements || !nodeVGrammarMark.elements.length) return;
-            const allNodeElements = nodeVGrammarMark.elements, linkVGrammarMark = this._linkMark.getProduct();
-            if (!linkVGrammarMark || !linkVGrammarMark.elements || !linkVGrammarMark.elements.length) return;
-            const allLinkElements = linkVGrammarMark.elements;
+            const nodeDatum = element.getDatum(), allNodeElements = this._nodeMark.getProductElements();
+            if (!allNodeElements || !allNodeElements.length) return;
+            const allLinkElements = this._linkMark.getProductElements();
+            if (!allLinkElements || !allLinkElements.length) return;
             if ("source" === ((null === (_a = allLinkElements[0].getDatum()) || void 0 === _a ? void 0 : _a.parents) ? "parents" : "source")) {
                 const highlightNodes = [ nodeDatum.key ], highlightLinks = [];
                 if (allLinkElements.forEach(((linkEl, i) => {
@@ -183,27 +157,15 @@ export class SankeySeries extends CartesianSeries {
                         }
                     }
                 })), this._linkMark) {
-                    const vGrammarMark = this._linkMark.getProduct();
-                    if (!vGrammarMark || !vGrammarMark.elements || !vGrammarMark.elements.length) return;
-                    vGrammarMark.elements.forEach(((linkEl, i) => {
+                    const allLinkElements = this._linkMark.getProductElements();
+                    if (!allLinkElements || !allLinkElements.length) return;
+                    allLinkElements.forEach(((linkEl, i) => {
                         var _a;
                         linkEl.clearStates(), highlightLinks.includes(null !== (_a = linkEl.getDatum().key) && void 0 !== _a ? _a : linkEl.getDatum().index) ? linkEl.useStates([ "selected" ]) : linkEl.useStates([ "blur" ]);
                     }));
                 }
-                if (this._nodeMark) {
-                    const vGrammarMark = this._nodeMark.getProduct();
-                    if (!vGrammarMark || !vGrammarMark.elements || !vGrammarMark.elements.length) return;
-                    vGrammarMark.elements.forEach((el => {
-                        el.clearStates(), highlightNodes.includes(el.getDatum().key) || el.useStates([ "blur" ]);
-                    }));
-                }
-                if (this._labelMark) {
-                    const vGrammarMark = this._labelMark.getProduct();
-                    if (!vGrammarMark || !vGrammarMark.elements || !vGrammarMark.elements.length) return;
-                    vGrammarMark.elements.forEach((el => {
-                        el.clearStates(), highlightNodes.includes(el.getDatum().key) || el.useStates([ "blur" ]);
-                    }));
-                }
+                this._nodeMark && this._highLightElements(this._nodeMark.getProductElements(), highlightNodes), 
+                this._labelMark && this._highLightElements(this._labelMark.getProductElements(), highlightNodes);
             } else {
                 const highlightNodes = [ nodeDatum.key ], upstreamLinks = nodeDatum.targetLinks.reduce(((res, link) => (array(link.datum).forEach((dividedLink => {
                     const parents = dividedLink.parents, len = parents.length;
@@ -216,7 +178,7 @@ export class SankeySeries extends CartesianSeries {
                         });
                     }
                 })), res)), []);
-                if (allLinkElements.forEach(((linkEl, i) => {
+                allLinkElements.forEach(((linkEl, i) => {
                     linkEl.clearStates();
                     const linkDatum = linkEl.getDatum(), father = (null == linkDatum ? void 0 : linkDatum.parents) ? "parents" : "source", originalDatum = linkDatum.datum, selectedDatum = originalDatum ? originalDatum.filter((entry => entry[father].some((par => par.key === nodeDatum.key)))) : null, upSelectedLink = upstreamLinks.find((upLink => upLink.source === linkDatum.source && upLink.target === linkDatum.target));
                     if (selectedDatum && selectedDatum.length) {
@@ -233,53 +195,30 @@ export class SankeySeries extends CartesianSeries {
                         ratio: upSelectedLink.value / linkDatum.value
                     });
                     linkEl.useStates([ "blur" ]);
-                })), this._nodeMark) {
-                    const vGrammarMark = this._nodeMark.getProduct();
-                    if (!vGrammarMark || !vGrammarMark.elements || !vGrammarMark.elements.length) return;
-                    vGrammarMark.elements.forEach((el => {
-                        el.clearStates(), highlightNodes.includes(el.getDatum().key) || el.useStates([ "blur" ]);
-                    }));
-                }
-                if (this._labelMark) {
-                    const vGrammarMark = this._labelMark.getProduct();
-                    if (!vGrammarMark || !vGrammarMark.elements || !vGrammarMark.elements.length) return;
-                    vGrammarMark.elements.forEach((el => {
-                        el.clearStates(), highlightNodes.includes(el.getDatum().key) || el.useStates([ "blur" ]);
-                    }));
-                }
+                })), this._nodeMark && this._highLightElements(this._nodeMark.getProductElements(), highlightNodes), 
+                this._labelMark && this._highLightElements(this._labelMark.getProductElements(), highlightNodes);
             }
         }, this._handleLinkRelatedClick = element => {
             var _a;
-            const nodeVGrammarMark = this._nodeMark.getProduct();
-            if (!nodeVGrammarMark || !nodeVGrammarMark.elements || !nodeVGrammarMark.elements.length) return;
-            const allNodeElements = nodeVGrammarMark.elements, linkVGrammarMark = this._linkMark.getProduct();
-            if (!linkVGrammarMark || !linkVGrammarMark.elements || !linkVGrammarMark.elements.length) return;
-            const allLinkElements = linkVGrammarMark.elements;
+            const allNodeElements = this._nodeMark.getProductElements();
+            if (!allNodeElements || !allNodeElements.length) return;
+            const allLinkElements = this._linkMark.getProductElements();
+            if (!allLinkElements || !allLinkElements.length) return;
             if ("source" === ((null === (_a = element.getDatum()) || void 0 === _a ? void 0 : _a.parents) ? "parents" : "source")) {
-                if (this._linkMark) {
-                    const vGrammarMark = this._linkMark.getProduct();
-                    if (!vGrammarMark || !vGrammarMark.elements || !vGrammarMark.elements.length) return;
-                    vGrammarMark.elements.forEach((linkEl => {
-                        linkEl.clearStates();
-                    }));
-                }
-                if (this._nodeMark) {
-                    const vGrammarMark = this._nodeMark.getProduct();
-                    if (!vGrammarMark || !vGrammarMark.elements || !vGrammarMark.elements.length) return;
-                    vGrammarMark.elements.forEach((el => {
-                        el.clearStates();
-                    }));
-                }
-                if (this._labelMark) {
-                    const vGrammarMark = this._labelMark.getProduct();
-                    if (!vGrammarMark || !vGrammarMark.elements || !vGrammarMark.elements.length) return;
-                    vGrammarMark.elements.forEach((el => {
+                if (this._linkMark && allLinkElements.forEach((linkEl => {
+                    linkEl.clearStates();
+                })), this._nodeMark && allNodeElements.forEach((el => {
+                    el.clearStates();
+                })), this._labelMark) {
+                    const allLabelElements = this._labelMark.getProductElements();
+                    if (!allLabelElements || !allLabelElements.length) return;
+                    allLabelElements.forEach((el => {
                         el.clearStates();
                     }));
                 }
             } else {
                 const curLinkDatum = element.getDatum(), highlightNodes = [ curLinkDatum.source, curLinkDatum.target ], upstreamLinks = [];
-                if (array(curLinkDatum.datum).forEach((dividedLink => {
+                array(curLinkDatum.datum).forEach((dividedLink => {
                     const parents = dividedLink.parents, len = parents.length;
                     for (let i = 0; i < len - 1; i++) {
                         const source = parents[i].key, target = parents[i + 1].key, value = dividedLink.value, existingItem = upstreamLinks.find((item => item.source === source && item.target === target));
@@ -322,15 +261,7 @@ export class SankeySeries extends CartesianSeries {
                         ratio: upSelectedLink.value / linkDatum.value
                     });
                     linkEl.useStates([ "blur" ]);
-                })), allNodeElements.forEach((el => {
-                    el.clearStates(), highlightNodes.includes(el.getDatum().key) || el.useStates([ "blur" ]);
-                })), this._labelMark) {
-                    const vGrammarMark = this._labelMark.getProduct();
-                    if (!vGrammarMark || !vGrammarMark.elements || !vGrammarMark.elements.length) return;
-                    vGrammarMark.elements.forEach((el => {
-                        el.clearStates(), highlightNodes.includes(el.getDatum().key) || el.useStates([ "blur" ]);
-                    }));
-                }
+                })), this._highLightElements(allNodeElements, highlightNodes), this._labelMark && this._highLightElements(this._labelMark.getProductElements(), highlightNodes);
             }
         };
     }
@@ -432,10 +363,9 @@ export class SankeySeries extends CartesianSeries {
         }
     }
     initMark() {
-        var _a, _b, _c, _d, _e;
+        var _a, _b, _c, _d;
         const nodeMark = this._createMark(SankeySeries.mark.node, {
             isSeriesMark: !0,
-            key: DEFAULT_DATA_INDEX,
             dataView: this._nodesSeriesData.getDataView(),
             dataProductId: this._nodesSeriesData.getProductId(),
             customShape: null === (_a = this._spec.node) || void 0 === _a ? void 0 : _a.customShape,
@@ -443,15 +373,13 @@ export class SankeySeries extends CartesianSeries {
         });
         nodeMark && (nodeMark.setZIndex(this._nodeLayoutZIndex), this._nodeMark = nodeMark);
         const linkMark = this._createMark(SankeySeries.mark.link, {
-            key: DEFAULT_DATA_INDEX,
             dataView: this._linksSeriesData.getDataView(),
             dataProductId: this._linksSeriesData.getProductId(),
             customShape: null === (_c = this._spec.link) || void 0 === _c ? void 0 : _c.customShape,
             stateSort: null === (_d = this._spec.link) || void 0 === _d ? void 0 : _d.stateSort
         });
-        if (linkMark && (this._linkMark = linkMark), null === (_e = this._spec.label) || void 0 === _e ? void 0 : _e.visible) {
+        if (linkMark && (this._linkMark = linkMark), this._spec.label && this._spec.label.visible) {
             const labelMark = this._createMark(SankeySeries.mark.label, {
-                key: DEFAULT_DATA_INDEX,
                 dataView: this._nodesSeriesData.getDataView(),
                 dataProductId: this._nodesSeriesData.getProductId()
             });
@@ -647,6 +575,11 @@ export class SankeySeries extends CartesianSeries {
     linksSeriesDataUpdate() {
         this._linksSeriesData.updateData();
     }
+    _highLightElements(vGrammarElements, highlightNodes) {
+        vGrammarElements && vGrammarElements.length && vGrammarElements.forEach((el => {
+            el.clearStates(), highlightNodes.includes(el.getDatum().key) || el.useStates([ "blur" ]);
+        }));
+    }
     initTooltip() {
         this._tooltipHelper = new SankeySeriesTooltipHelper(this), this._nodeMark && this._tooltipHelper.activeTriggerSet.mark.add(this._nodeMark), 
         this._linkMark && this._tooltipHelper.activeTriggerSet.mark.add(this._linkMark),