@visactor/vchart 1.15.5-alpha.8 → 2.0.0-alpha.0

package/esm/series/sankey/sankey.js

@@ -2,8 +2,6 @@ import { CartesianSeries } from "../cartesian/cartesian";
 
 import { SeriesTypeEnum } from "../interface/type";
 
-import { registerSankeyTransforms } from "@visactor/vgrammar-sankey";
-
 import { animationConfig, userAnimationConfig } from "../../animation/utils";
 
 import { registerFadeInOutAnimation } from "../../animation/config";
@@ -26,8 +24,6 @@ import { AttributeLevel } from "../../constant/attribute";
 
 import { Event_Bubble_Level } from "../../constant/event";
 
-import { SeriesData } from "../base/series-data";
-
 import { SankeySeriesTooltipHelper } from "./tooltip-helper";
 
 import { Bounds, array, isNil, isValid, isNumber, isArray } from "@visactor/vutils";
@@ -56,6 +52,10 @@ import { SankeySeriesSpecTransformer } from "./sankey-transformer";
 
 import { getFormatFunction } from "../../component/util";
 
+import { getDatumOfGraphic } from "../../util";
+
+import { addRuntimeState } from "../../mark/utils/glyph";
+
 export class SankeySeries extends CartesianSeries {
     constructor() {
         super(...arguments), this.type = SeriesTypeEnum.sankey, this.transformerConstructor = SankeySeriesSpecTransformer, 
@@ -71,73 +71,71 @@ export class SankeySeries extends CartesianSeries {
             }
             return null === (_e = this._colorScale) || void 0 === _e ? void 0 : _e.scale(this._getNodeNameFromData(datum));
         }, this._fillByLink = datum => {
-            var _a, _b, _c, _d, _e, _f, _g;
+            var _a, _b, _c, _d, _e, _f;
             const fill = null === (_b = null === (_a = this._spec.link) || void 0 === _a ? void 0 : _a.style) || void 0 === _b ? void 0 : _b.fill;
             if (fill) return fill;
             if (isValid(this._spec.seriesField)) {
-                const sourceNode = null === (_d = null === (_c = this._nodesSeriesData) || void 0 === _c ? void 0 : _c.getLatestData()) || void 0 === _d ? void 0 : _d.find((entry => datum.source === entry.key)), nodeDatum = null == sourceNode ? void 0 : sourceNode.datum, colorScale = null === (_f = null === (_e = this._option) || void 0 === _e ? void 0 : _e.globalScale) || void 0 === _f ? void 0 : _f.getScale("color");
+                const sourceNode = null === (_c = this._nodesSeriesData.latestData) || void 0 === _c ? void 0 : _c.find((entry => datum.source === entry.key)), nodeDatum = null == sourceNode ? void 0 : sourceNode.datum, colorScale = null === (_e = null === (_d = this._option) || void 0 === _d ? void 0 : _d.globalScale) || void 0 === _e ? void 0 : _e.getScale("color");
                 return null == colorScale ? void 0 : colorScale.scale(null == nodeDatum ? void 0 : nodeDatum[this._spec.seriesField]);
             }
             const sourceName = isNumber(datum.source) ? this.getNodeList()[datum.source] : datum.source;
-            return null === (_g = this._colorScale) || void 0 === _g ? void 0 : _g.scale(sourceName);
+            return null === (_f = this._colorScale) || void 0 === _f ? void 0 : _f.scale(sourceName);
         }, this._handleEmphasisElement = params => {
-            var _a, _b, _c, _d, _e;
-            const emphasisSpec = null !== (_a = this._spec.emphasis) && void 0 !== _a ? _a : {}, element = params.item;
-            "adjacency" === emphasisSpec.effect ? element && element.mark === (null === (_b = this._nodeMark) || void 0 === _b ? void 0 : _b.getProduct()) ? this._handleNodeAdjacencyClick(element) : element && element.mark === (null === (_c = this._linkMark) || void 0 === _c ? void 0 : _c.getProduct()) ? this._handleLinkAdjacencyClick(element) : this._handleClearEmpty() : "related" === emphasisSpec.effect && (element && element.mark === (null === (_d = this._nodeMark) || void 0 === _d ? void 0 : _d.getProduct()) ? this._handleNodeRelatedClick(element) : element && element.mark === (null === (_e = this._linkMark) || void 0 === _e ? void 0 : _e.getProduct()) ? this._handleLinkRelatedClick(element) : this._handleClearEmpty());
+            var _a;
+            const emphasisSpec = null !== (_a = this._spec.emphasis) && void 0 !== _a ? _a : {}, graphic = params.item;
+            "adjacency" === emphasisSpec.effect ? graphic && params.mark === this._nodeMark ? this._handleNodeAdjacencyClick(graphic) : graphic && params.mark === this._linkMark ? this._handleLinkAdjacencyClick(graphic) : this._handleClearEmpty() : "related" === emphasisSpec.effect && (graphic && params.mark === this._nodeMark ? this._handleNodeRelatedClick(graphic) : graphic && params.mark === this._linkMark ? this._handleLinkRelatedClick(graphic) : this._handleClearEmpty());
         }, this._handleClearEmpty = () => {
             var _a, _b;
             if (!this._needClear) return;
-            const allNodeElements = null === (_a = this._nodeMark) || void 0 === _a ? void 0 : _a.getProductElements();
+            const allNodeElements = null === (_a = this._nodeMark) || void 0 === _a ? void 0 : _a.getGraphics();
             if (!allNodeElements || !allNodeElements.length) return;
-            const allLinkElements = null === (_b = this._linkMark) || void 0 === _b ? void 0 : _b.getProductElements();
-            if (!allLinkElements || !allLinkElements.length) return;
-            const states = [ STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE ];
-            allNodeElements.forEach((el => {
-                el.removeState(states);
+            const allLinkElements = null === (_b = this._linkMark) || void 0 === _b ? void 0 : _b.getGraphics();
+            allLinkElements && allLinkElements.length && (allNodeElements.forEach((el => {
+                el.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS), el.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE);
             })), allLinkElements.forEach((el => {
-                el.removeState(states);
-            })), this._needClear = !1;
-        }, this._handleNodeAdjacencyClick = element => {
-            const nodeDatum = element.getDatum(), highlightNodes = [ nodeDatum.key ];
+                el.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS), el.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE);
+            })), this._needClear = !1);
+        }, this._handleNodeAdjacencyClick = graphic => {
+            const nodeDatum = getDatumOfGraphic(graphic), highlightNodes = [ nodeDatum.key ];
             if (this._linkMark) {
-                const allLinkElements = this._linkMark.getProductElements();
+                const allLinkElements = this._linkMark.getGraphics();
                 if (!allLinkElements || !allLinkElements.length) return;
                 allLinkElements.forEach(((linkEl, i) => {
-                    const linkDatum = linkEl.getDatum();
+                    const linkDatum = getDatumOfGraphic(linkEl);
                     linkDatum.source === nodeDatum.key ? (highlightNodes.includes(linkDatum.target) || highlightNodes.push(linkDatum.target), 
-                    linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS)) : linkDatum.target === nodeDatum.key ? (highlightNodes.includes(linkDatum.source) || highlightNodes.push(linkDatum.source), 
-                    linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS)) : (linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS), 
-                    linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE));
+                    linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, !0)) : linkDatum.target === nodeDatum.key ? (highlightNodes.includes(linkDatum.source) || highlightNodes.push(linkDatum.source), 
+                    linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, !0)) : (linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS), 
+                    linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE, !0));
                 }));
             }
-            this._nodeMark && this._highLightElements(this._nodeMark.getProductElements(), highlightNodes), 
+            this._nodeMark && this._highLightElements(this._nodeMark.getGraphics(), highlightNodes), 
             this._needClear = !0;
-        }, this._handleLinkAdjacencyClick = element => {
-            const curLinkDatum = element.getDatum(), highlightNodes = [ curLinkDatum.source, curLinkDatum.target ];
+        }, this._handleLinkAdjacencyClick = graphic => {
+            const curLinkDatum = getDatumOfGraphic(graphic), highlightNodes = [ curLinkDatum.source, curLinkDatum.target ];
             if (this._linkMark) {
-                const allLinkElements = this._linkMark.getProductElements();
+                const allLinkElements = this._linkMark.getGraphics();
                 if (!allLinkElements || !allLinkElements.length) return;
                 allLinkElements.forEach((linkEl => {
-                    linkEl === element ? (linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), 
-                    linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, {
+                    linkEl === graphic ? (linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), 
+                    addRuntimeState(linkEl, STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, {
                         ratio: 1
-                    })) : (linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS), linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE));
+                    })) : (linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS), linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE, !0));
                 }));
             }
-            this._nodeMark && this._highLightElements(this._nodeMark.getProductElements(), highlightNodes), 
+            this._nodeMark && this._highLightElements(this._nodeMark.getGraphics(), highlightNodes), 
             this._needClear = !0;
-        }, this._handleNodeRelatedClick = element => {
+        }, this._handleNodeRelatedClick = graphic => {
             var _a;
-            const nodeDatum = element.getDatum(), allNodeElements = this._nodeMark.getProductElements();
+            const nodeDatum = getDatumOfGraphic(graphic), allNodeElements = this._nodeMark.getGraphics();
             if (!allNodeElements || !allNodeElements.length) return;
-            const allLinkElements = this._linkMark.getProductElements();
+            const allLinkElements = this._linkMark.getGraphics();
             if (!allLinkElements || !allLinkElements.length) return;
-            const father = (null === (_a = allLinkElements[0].getDatum()) || void 0 === _a ? void 0 : _a.parents) ? "parents" : "source";
+            const father = (null === (_a = getDatumOfGraphic(allLinkElements[0])) || void 0 === _a ? void 0 : _a.parents) ? "parents" : "source";
             if ("source" === father) {
                 const highlightNodes = [ nodeDatum.key ], highlightLinks = [];
                 if (allLinkElements.forEach(((linkEl, i) => {
                     var _a, _b, _c, _d;
-                    const linkDatum = linkEl.getDatum(), father = (null == linkDatum ? void 0 : linkDatum.parents) ? "parents" : "source";
+                    const linkDatum = getDatumOfGraphic(linkEl), father = (null == linkDatum ? void 0 : linkDatum.parents) ? "parents" : "source";
                     if (array(linkDatum[father]).includes(nodeDatum.key)) {
                         if (highlightLinks.includes(null !== (_a = linkDatum.key) && void 0 !== _a ? _a : linkDatum.index) || highlightLinks.push(null !== (_b = linkDatum.key) && void 0 !== _b ? _b : linkDatum.index), 
                         highlightNodes.includes(linkDatum.source) || highlightNodes.push(linkDatum.source), 
@@ -175,16 +173,17 @@ export class SankeySeries extends CartesianSeries {
                         }
                     }
                 })), this._linkMark) {
-                    const allLinkElements = this._linkMark.getProductElements();
+                    const allLinkElements = this._linkMark.getGraphics();
                     if (!allLinkElements || !allLinkElements.length) return;
                     allLinkElements.forEach(((linkEl, i) => {
                         var _a;
-                        highlightLinks.includes(null !== (_a = linkEl.getDatum().key) && void 0 !== _a ? _a : linkEl.getDatum().index) ? (linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), 
-                        linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS)) : (linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS), 
-                        linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE));
+                        const linkDatum = getDatumOfGraphic(linkEl);
+                        highlightLinks.includes(null !== (_a = linkDatum.key) && void 0 !== _a ? _a : linkDatum.index) ? (linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), 
+                        linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, !0)) : (linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS), 
+                        linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE, !0));
                     }));
                 }
-                this._nodeMark && this._highLightElements(this._nodeMark.getProductElements(), highlightNodes);
+                this._nodeMark && this._highLightElements(this._nodeMark.getGraphics(), highlightNodes);
             } else {
                 const highlightNodes = [ nodeDatum.key ], upstreamLinks = nodeDatum.targetLinks.reduce(((res, link) => (array(link.datum).forEach((dividedLink => {
                     const parents = dividedLink.parents, len = parents.length;
@@ -198,39 +197,35 @@ export class SankeySeries extends CartesianSeries {
                     }
                 })), res)), []);
                 allLinkElements.forEach(((linkEl, i) => {
-                    const linkDatum = linkEl.getDatum(), 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));
+                    const linkDatum = getDatumOfGraphic(linkEl), 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) {
                         highlightNodes.includes(linkDatum.source) || highlightNodes.push(linkDatum.source), 
                         highlightNodes.includes(linkDatum.target) || highlightNodes.push(linkDatum.target);
                         const ratio = selectedDatum.reduce(((sum, d) => sum + d.value), 0) / linkDatum.value;
-                        return linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), void linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, {
+                        return linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), void addRuntimeState(linkEl, STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, {
                             ratio: ratio
                         });
                     }
                     if (upSelectedLink) return highlightNodes.includes(linkDatum.source) || highlightNodes.push(linkDatum.source), 
                     highlightNodes.includes(linkDatum.target) || highlightNodes.push(linkDatum.target), 
-                    linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), void linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, {
+                    linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), void addRuntimeState(linkEl, STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, {
                         ratio: upSelectedLink.value / linkDatum.value
                     });
-                    linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS), linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE);
-                })), this._nodeMark && this._highLightElements(this._nodeMark.getProductElements(), highlightNodes);
+                    linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS), linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE, !0);
+                })), this._nodeMark && this._highLightElements(this._nodeMark.getGraphics(), highlightNodes);
             }
             this._needClear = !0;
-        }, this._handleLinkRelatedClick = element => {
-            var _a;
-            const allNodeElements = this._nodeMark.getProductElements();
+        }, this._handleLinkRelatedClick = graphic => {
+            const allNodeElements = this._nodeMark.getGraphics();
             if (!allNodeElements || !allNodeElements.length) return;
-            const allLinkElements = this._linkMark.getProductElements();
+            const allLinkElements = this._linkMark.getGraphics();
             if (!allLinkElements || !allLinkElements.length) return;
-            if ("source" === ((null === (_a = element.getDatum()) || void 0 === _a ? void 0 : _a.parents) ? "parents" : "source")) {
-                const states = [ STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE ];
-                this._linkMark && allLinkElements.forEach((linkEl => {
-                    linkEl.removeState(states);
-                })), this._nodeMark && allNodeElements.forEach((el => {
-                    el.removeState(states);
-                }));
-            } else {
-                const curLinkDatum = element.getDatum(), highlightNodes = [ curLinkDatum.source, curLinkDatum.target ], upstreamLinks = [];
+            if ("source" === (getDatumOfGraphic(graphic) ? "parents" : "source")) this._linkMark && allLinkElements.forEach((linkEl => {
+                linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS), linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE);
+            })), this._nodeMark && allNodeElements.forEach((el => {
+                el.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS), el.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE);
+            })); else {
+                const curLinkDatum = getDatumOfGraphic(graphic), highlightNodes = [ curLinkDatum.source, curLinkDatum.target ], upstreamLinks = [];
                 array(curLinkDatum.datum).forEach((dividedLink => {
                     const parents = dividedLink.parents, len = parents.length;
                     for (let i = 0; i < len - 1; i++) {
@@ -246,9 +241,9 @@ export class SankeySeries extends CartesianSeries {
                         });
                     }
                 })), allLinkElements.forEach((linkEl => {
-                    const linkDatum = linkEl.getDatum(), originalDatum = linkDatum.datum;
+                    const linkDatum = getDatumOfGraphic(linkEl), originalDatum = linkDatum.datum;
                     if (linkDatum.source === curLinkDatum.source && linkDatum.target === curLinkDatum.target) return linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), 
-                    void linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, {
+                    void addRuntimeState(linkEl, STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, {
                         ratio: 1
                     });
                     const selectedDatum = originalDatum ? originalDatum.filter((entry => {
@@ -258,21 +253,21 @@ export class SankeySeries extends CartesianSeries {
                     if (selectedDatum && selectedDatum.length) {
                         highlightNodes.includes(linkDatum.source) || highlightNodes.push(linkDatum.source), 
                         highlightNodes.includes(linkDatum.target) || highlightNodes.push(linkDatum.target);
-                        const val = selectedDatum.filter((entry => entry.parents.some(((par, index) => {
+                        const ratio = selectedDatum.filter((entry => entry.parents.some(((par, index) => {
                             var _a;
                             return par.key === curLinkDatum.source && (null === (_a = entry.parents[index + 1]) || void 0 === _a ? void 0 : _a.key) === curLinkDatum.target;
-                        })))).reduce(((sum, d) => sum + d.value), 0), ratio = val / linkDatum.value;
-                        return linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), void linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, {
+                        })))).reduce(((sum, d) => sum + d.value), 0) / linkDatum.value;
+                        return linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), void addRuntimeState(linkEl, STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, {
                             ratio: ratio
                         });
                     }
                     const upSelectedLink = upstreamLinks.find((upLink => upLink.source === linkDatum.source && upLink.target === linkDatum.target));
                     if (upSelectedLink) return highlightNodes.includes(linkDatum.source) || highlightNodes.push(linkDatum.source), 
                     highlightNodes.includes(linkDatum.target) || highlightNodes.push(linkDatum.target), 
-                    linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), void linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, {
+                    linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), void addRuntimeState(linkEl, STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, {
                         ratio: upSelectedLink.value / linkDatum.value
                     });
-                    linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS), linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE);
+                    linkEl.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS), linkEl.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE, !0);
                 })), this._highLightElements(allNodeElements, highlightNodes);
             }
             this._needClear = !0;
@@ -370,7 +365,7 @@ export class SankeySeries extends CartesianSeries {
                     beforeCall: initKeyMap.bind(this),
                     call: addDataKey
                 }
-            }, !1), this._nodesSeriesData = new SeriesData(this._option, nodesDataView), registerDataSetInstanceTransform(dataSet, "sankeyLinks", sankeyLinks);
+            }, !1), this._nodesSeriesData = nodesDataView, registerDataSetInstanceTransform(dataSet, "sankeyLinks", sankeyLinks);
             const linksDataView = new DataView(dataSet, {
                 name: `sankey-link-${this.id}-data`
             });
@@ -384,37 +379,28 @@ export class SankeySeries extends CartesianSeries {
                     beforeCall: initKeyMap.bind(this),
                     call: addDataKey
                 }
-            }, !1), this._linksSeriesData = new SeriesData(this._option, linksDataView);
+            }, !1), this._linksSeriesData = linksDataView;
         }
     }
     compileData() {
         var _a, _b;
-        super.compileData(), null === (_a = this._linksSeriesData) || void 0 === _a || _a.compile(), 
-        null === (_b = this._nodesSeriesData) || void 0 === _b || _b.compile();
+        super.compileData(), null === (_a = this._linkMark) || void 0 === _a || _a.compileData(), 
+        null === (_b = this._nodeMark) || void 0 === _b || _b.compileData();
     }
     initMark() {
-        var _a, _b, _c, _d;
         this._rootMark.setMarkConfig({
             overflow: this._spec.overflow,
             interactive: !!this._spec.overflow
         });
         const nodeMark = this._createMark(SankeySeries.mark.node, {
             isSeriesMark: !0,
-            dataView: this._nodesSeriesData.getDataView(),
-            dataProductId: this._nodesSeriesData.getProductId(),
-            stateSort: null === (_a = this._spec.node) || void 0 === _a ? void 0 : _a.stateSort
-        }, {
-            setCustomizedShape: null === (_b = this._spec.node) || void 0 === _b ? void 0 : _b.customShape
+            dataView: this._nodesSeriesData
         });
         nodeMark && (nodeMark.setMarkConfig({
             zIndex: this._nodeLayoutZIndex
         }), this._nodeMark = nodeMark);
         const linkMark = this._createMark(SankeySeries.mark.link, {
-            dataView: this._linksSeriesData.getDataView(),
-            dataProductId: this._linksSeriesData.getProductId(),
-            stateSort: null === (_c = this._spec.link) || void 0 === _c ? void 0 : _c.stateSort
-        }, {
-            setCustomizedShape: null === (_d = this._spec.link) || void 0 === _d ? void 0 : _d.customShape
+            dataView: this._linksSeriesData
         });
         linkMark && (this._linkMark = linkMark);
     }
@@ -423,11 +409,11 @@ export class SankeySeries extends CartesianSeries {
         this._markAttributeContext.valueToLink = this.valueToLink.bind(this);
     }
     valueToNode(value) {
-        const nodes = this._nodesSeriesData.getLatestData(), specifyValue = array(value)[0];
+        const nodes = this._nodesSeriesData.latestData, specifyValue = array(value)[0];
         return nodes && nodes.find((node => node.key === specifyValue));
     }
     valueToLink(value) {
-        const links = this._linksSeriesData.getLatestData(), specifyValue = array(value);
+        const links = this._linksSeriesData.latestData, specifyValue = array(value);
         return links && links.find((link => link && link.source === specifyValue[0] && link.target === specifyValue[1]));
     }
     valueToPositionX(value) {
@@ -456,13 +442,14 @@ export class SankeySeries extends CartesianSeries {
     _initLinkMarkStyle() {
         var _a, _b;
         const linkMark = this._linkMark;
-        linkMark && (this.setMarkStyle(linkMark, {
+        linkMark && (linkMark.setGlyphConfig({
+            direction: this.direction
+        }), this.setMarkStyle(linkMark, {
             x0: datum => datum.x0,
             x1: datum => datum.x1,
             y0: datum => datum.y0,
             y1: datum => datum.y1,
-            thickness: datum => datum.thickness,
-            direction: this.direction
+            thickness: datum => datum.thickness
         }, STATE_VALUE_ENUM.STATE_NORMAL, AttributeLevel.Series), this.setMarkStyle(linkMark, {
             fill: null !== (_b = null === (_a = this._spec.link.style) || void 0 === _a ? void 0 : _a.fill) && void 0 !== _b ? _b : this._fillByLink
         }, "normal", AttributeLevel.User_Mark));
@@ -507,8 +494,8 @@ export class SankeySeries extends CartesianSeries {
     }
     initEvent() {
         var _a, _b, _c;
-        super.initEvent(), null === (_a = this._nodesSeriesData.getDataView()) || void 0 === _a || _a.target.addListener("change", this.nodesSeriesDataUpdate.bind(this)), 
-        null === (_b = this._linksSeriesData.getDataView()) || void 0 === _b || _b.target.addListener("change", this.linksSeriesDataUpdate.bind(this));
+        super.initEvent(), null === (_a = this._nodesSeriesData) || void 0 === _a || _a.target.addListener("change", this.nodesSeriesDataUpdate.bind(this)), 
+        null === (_b = this._linksSeriesData) || void 0 === _b || _b.target.addListener("change", this.linksSeriesDataUpdate.bind(this));
         const emphasisSpec = null !== (_c = this._spec.emphasis) && void 0 !== _c ? _c : {};
         if (!0 !== this._option.disableTriggerEvent && emphasisSpec.enable && ("adjacency" === emphasisSpec.effect || "related" === emphasisSpec.effect)) {
             const event = "hover" === emphasisSpec.trigger ? "pointerover" : "pointerdown";
@@ -518,15 +505,15 @@ export class SankeySeries extends CartesianSeries {
         }
     }
     nodesSeriesDataUpdate() {
-        this._nodesSeriesData.updateData(), this._nodeList = null, this._setNodeOrdinalColorScale();
+        this._nodeMark.getData().updateData(), this._nodeList = null, this._setNodeOrdinalColorScale();
     }
     linksSeriesDataUpdate() {
-        this._linksSeriesData.updateData();
+        this._linkMark.getData().updateData();
     }
-    _highLightElements(vGrammarElements, highlightNodes) {
-        vGrammarElements && vGrammarElements.length && vGrammarElements.forEach((el => {
-            el.removeState([ STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE, STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS ]), 
-            highlightNodes.includes(el.getDatum().key) ? el.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS) : el.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE);
+    _highLightElements(graphics, highlightNodes) {
+        graphics && graphics.length && graphics.forEach((g => {
+            g.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE), g.removeState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS), 
+            highlightNodes.includes(getDatumOfGraphic(g).key) ? g.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS, !0) : g.addState(STATE_VALUE_ENUM.STATE_SANKEY_EMPHASIS_REVERSE, !0);
         }));
     }
     initTooltip() {
@@ -596,8 +583,8 @@ export class SankeySeries extends CartesianSeries {
         }
         return keyArray;
     }
-    onLayoutEnd(ctx) {
-        super.onLayoutEnd(ctx), this._viewBox.set(0, 0, this._region.getLayoutRect().width, this._region.getLayoutRect().height), 
+    onLayoutEnd() {
+        super.onLayoutEnd(), this._viewBox.set(0, 0, this._region.getLayoutRect().width, this._region.getLayoutRect().height), 
         this.getViewData().reRunAllTransform();
     }
     getDefaultShapeType() {
@@ -616,7 +603,7 @@ SankeySeries.type = SeriesTypeEnum.sankey, SankeySeries.transformerConstructor =
 SankeySeries.mark = sankeySeriesMark;
 
 export const registerSankeySeries = () => {
-    registerSankeyTransforms(), registerRectMark(), registerLinkPathMark(), registerTextMark(), 
-    registerSankeyAnimation(), registerFadeInOutAnimation(), Factory.registerSeries(SankeySeries.type, SankeySeries);
+    registerRectMark(), registerLinkPathMark(), registerTextMark(), registerSankeyAnimation(), 
+    registerFadeInOutAnimation(), Factory.registerSeries(SankeySeries.type, SankeySeries);
 };
 //# sourceMappingURL=sankey.js.map