123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330 |
- /*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
- /**
- * AUTO-GENERATED FILE. DO NOT MODIFY.
- */
- /*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
- import { __extends } from "tslib";
- import * as graphic from '../../util/graphic.js';
- import { enterEmphasis, leaveEmphasis, toggleHoverEmphasis, setStatesStylesFromModel } from '../../util/states.js';
- import ChartView from '../../view/Chart.js';
- import { setLabelStyle, getLabelStatesModels } from '../../label/labelStyle.js';
- import { getECData } from '../../util/innerStore.js';
- import { isString } from 'zrender/lib/core/util.js';
- var SankeyPathShape =
- /** @class */
- function () {
- function SankeyPathShape() {
- this.x1 = 0;
- this.y1 = 0;
- this.x2 = 0;
- this.y2 = 0;
- this.cpx1 = 0;
- this.cpy1 = 0;
- this.cpx2 = 0;
- this.cpy2 = 0;
- this.extent = 0;
- }
- return SankeyPathShape;
- }();
- var SankeyPath =
- /** @class */
- function (_super) {
- __extends(SankeyPath, _super);
- function SankeyPath(opts) {
- return _super.call(this, opts) || this;
- }
- SankeyPath.prototype.getDefaultShape = function () {
- return new SankeyPathShape();
- };
- SankeyPath.prototype.buildPath = function (ctx, shape) {
- var extent = shape.extent;
- ctx.moveTo(shape.x1, shape.y1);
- ctx.bezierCurveTo(shape.cpx1, shape.cpy1, shape.cpx2, shape.cpy2, shape.x2, shape.y2);
- if (shape.orient === 'vertical') {
- ctx.lineTo(shape.x2 + extent, shape.y2);
- ctx.bezierCurveTo(shape.cpx2 + extent, shape.cpy2, shape.cpx1 + extent, shape.cpy1, shape.x1 + extent, shape.y1);
- } else {
- ctx.lineTo(shape.x2, shape.y2 + extent);
- ctx.bezierCurveTo(shape.cpx2, shape.cpy2 + extent, shape.cpx1, shape.cpy1 + extent, shape.x1, shape.y1 + extent);
- }
- ctx.closePath();
- };
- SankeyPath.prototype.highlight = function () {
- enterEmphasis(this);
- };
- SankeyPath.prototype.downplay = function () {
- leaveEmphasis(this);
- };
- return SankeyPath;
- }(graphic.Path);
- var SankeyView =
- /** @class */
- function (_super) {
- __extends(SankeyView, _super);
- function SankeyView() {
- var _this = _super !== null && _super.apply(this, arguments) || this;
- _this.type = SankeyView.type;
- _this._focusAdjacencyDisabled = false;
- return _this;
- }
- SankeyView.prototype.render = function (seriesModel, ecModel, api) {
- var sankeyView = this;
- var graph = seriesModel.getGraph();
- var group = this.group;
- var layoutInfo = seriesModel.layoutInfo; // view width
- var width = layoutInfo.width; // view height
- var height = layoutInfo.height;
- var nodeData = seriesModel.getData();
- var edgeData = seriesModel.getData('edge');
- var orient = seriesModel.get('orient');
- this._model = seriesModel;
- group.removeAll();
- group.x = layoutInfo.x;
- group.y = layoutInfo.y; // generate a bezire Curve for each edge
- graph.eachEdge(function (edge) {
- var curve = new SankeyPath();
- var ecData = getECData(curve);
- ecData.dataIndex = edge.dataIndex;
- ecData.seriesIndex = seriesModel.seriesIndex;
- ecData.dataType = 'edge';
- var edgeModel = edge.getModel();
- var lineStyleModel = edgeModel.getModel('lineStyle');
- var curvature = lineStyleModel.get('curveness');
- var n1Layout = edge.node1.getLayout();
- var node1Model = edge.node1.getModel();
- var dragX1 = node1Model.get('localX');
- var dragY1 = node1Model.get('localY');
- var n2Layout = edge.node2.getLayout();
- var node2Model = edge.node2.getModel();
- var dragX2 = node2Model.get('localX');
- var dragY2 = node2Model.get('localY');
- var edgeLayout = edge.getLayout();
- var x1;
- var y1;
- var x2;
- var y2;
- var cpx1;
- var cpy1;
- var cpx2;
- var cpy2;
- curve.shape.extent = Math.max(1, edgeLayout.dy);
- curve.shape.orient = orient;
- if (orient === 'vertical') {
- x1 = (dragX1 != null ? dragX1 * width : n1Layout.x) + edgeLayout.sy;
- y1 = (dragY1 != null ? dragY1 * height : n1Layout.y) + n1Layout.dy;
- x2 = (dragX2 != null ? dragX2 * width : n2Layout.x) + edgeLayout.ty;
- y2 = dragY2 != null ? dragY2 * height : n2Layout.y;
- cpx1 = x1;
- cpy1 = y1 * (1 - curvature) + y2 * curvature;
- cpx2 = x2;
- cpy2 = y1 * curvature + y2 * (1 - curvature);
- } else {
- x1 = (dragX1 != null ? dragX1 * width : n1Layout.x) + n1Layout.dx;
- y1 = (dragY1 != null ? dragY1 * height : n1Layout.y) + edgeLayout.sy;
- x2 = dragX2 != null ? dragX2 * width : n2Layout.x;
- y2 = (dragY2 != null ? dragY2 * height : n2Layout.y) + edgeLayout.ty;
- cpx1 = x1 * (1 - curvature) + x2 * curvature;
- cpy1 = y1;
- cpx2 = x1 * curvature + x2 * (1 - curvature);
- cpy2 = y2;
- }
- curve.setShape({
- x1: x1,
- y1: y1,
- x2: x2,
- y2: y2,
- cpx1: cpx1,
- cpy1: cpy1,
- cpx2: cpx2,
- cpy2: cpy2
- });
- curve.useStyle(lineStyleModel.getItemStyle()); // Special color, use source node color or target node color
- switch (curve.style.fill) {
- case 'source':
- curve.style.fill = edge.node1.getVisual('color');
- curve.style.decal = edge.node1.getVisual('style').decal;
- break;
- case 'target':
- curve.style.fill = edge.node2.getVisual('color');
- curve.style.decal = edge.node2.getVisual('style').decal;
- break;
- case 'gradient':
- var sourceColor = edge.node1.getVisual('color');
- var targetColor = edge.node2.getVisual('color');
- if (isString(sourceColor) && isString(targetColor)) {
- curve.style.fill = new graphic.LinearGradient(0, 0, +(orient === 'horizontal'), +(orient === 'vertical'), [{
- color: sourceColor,
- offset: 0
- }, {
- color: targetColor,
- offset: 1
- }]);
- }
- }
- var emphasisModel = edgeModel.getModel('emphasis');
- setStatesStylesFromModel(curve, edgeModel, 'lineStyle', function (model) {
- return model.getItemStyle();
- });
- group.add(curve);
- edgeData.setItemGraphicEl(edge.dataIndex, curve);
- var focus = emphasisModel.get('focus');
- toggleHoverEmphasis(curve, focus === 'adjacency' ? edge.getAdjacentDataIndices() : focus, emphasisModel.get('blurScope'), emphasisModel.get('disabled'));
- getECData(curve).dataType = 'edge';
- }); // Generate a rect for each node
- graph.eachNode(function (node) {
- var layout = node.getLayout();
- var itemModel = node.getModel();
- var dragX = itemModel.get('localX');
- var dragY = itemModel.get('localY');
- var emphasisModel = itemModel.getModel('emphasis');
- var rect = new graphic.Rect({
- shape: {
- x: dragX != null ? dragX * width : layout.x,
- y: dragY != null ? dragY * height : layout.y,
- width: layout.dx,
- height: layout.dy
- },
- style: itemModel.getModel('itemStyle').getItemStyle(),
- z2: 10
- });
- setLabelStyle(rect, getLabelStatesModels(itemModel), {
- labelFetcher: seriesModel,
- labelDataIndex: node.dataIndex,
- defaultText: node.id
- });
- rect.disableLabelAnimation = true;
- rect.setStyle('fill', node.getVisual('color'));
- rect.setStyle('decal', node.getVisual('style').decal);
- setStatesStylesFromModel(rect, itemModel);
- group.add(rect);
- nodeData.setItemGraphicEl(node.dataIndex, rect);
- getECData(rect).dataType = 'node';
- var focus = emphasisModel.get('focus');
- toggleHoverEmphasis(rect, focus === 'adjacency' ? node.getAdjacentDataIndices() : focus, emphasisModel.get('blurScope'), emphasisModel.get('disabled'));
- });
- nodeData.eachItemGraphicEl(function (el, dataIndex) {
- var itemModel = nodeData.getItemModel(dataIndex);
- if (itemModel.get('draggable')) {
- el.drift = function (dx, dy) {
- sankeyView._focusAdjacencyDisabled = true;
- this.shape.x += dx;
- this.shape.y += dy;
- this.dirty();
- api.dispatchAction({
- type: 'dragNode',
- seriesId: seriesModel.id,
- dataIndex: nodeData.getRawIndex(dataIndex),
- localX: this.shape.x / width,
- localY: this.shape.y / height
- });
- };
- el.ondragend = function () {
- sankeyView._focusAdjacencyDisabled = false;
- };
- el.draggable = true;
- el.cursor = 'move';
- }
- });
- if (!this._data && seriesModel.isAnimationEnabled()) {
- group.setClipPath(createGridClipShape(group.getBoundingRect(), seriesModel, function () {
- group.removeClipPath();
- }));
- }
- this._data = seriesModel.getData();
- };
- SankeyView.prototype.dispose = function () {};
- SankeyView.type = 'sankey';
- return SankeyView;
- }(ChartView); // Add animation to the view
- function createGridClipShape(rect, seriesModel, cb) {
- var rectEl = new graphic.Rect({
- shape: {
- x: rect.x - 10,
- y: rect.y - 10,
- width: 0,
- height: rect.height + 20
- }
- });
- graphic.initProps(rectEl, {
- shape: {
- width: rect.width + 20
- }
- }, seriesModel, cb);
- return rectEl;
- }
- export default SankeyView;
|