This is an automated email from the ASF dual-hosted git repository. deqingli pushed a commit to branch master in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git
commit f80afbed6e59031b72902865b19aa1999669947b Author: deqingli <annong...@gmail.com> AuthorDate: Mon Oct 15 13:32:51 2018 +0800 feat(sankey): add left node align in sankey diagram --- src/chart/sankey/SankeySeries.js | 5 ++ src/chart/sankey/sankeyLayout.js | 14 +++-- src/chart/themeRiver/ThemeRiverSeries.js | 2 +- test/sankey-nodeAlign-left.html | 93 ++++++++++++++++++++++++++++++++ 4 files changed, 108 insertions(+), 6 deletions(-) diff --git a/src/chart/sankey/SankeySeries.js b/src/chart/sankey/SankeySeries.js index bb3b33e..829737f 100644 --- a/src/chart/sankey/SankeySeries.js +++ b/src/chart/sankey/SankeySeries.js @@ -143,6 +143,11 @@ var SankeySeries = SeriesModel.extend({ fontSize: 12 }, + levels: [], + + // Value can be 'left', 'right' + nodeAlign: 'justify', + itemStyle: { borderWidth: 1, borderColor: '#333' diff --git a/src/chart/sankey/sankeyLayout.js b/src/chart/sankey/sankeyLayout.js index ef77ff0..16c88eb 100644 --- a/src/chart/sankey/sankeyLayout.js +++ b/src/chart/sankey/sankeyLayout.js @@ -57,7 +57,9 @@ export default function (ecModel, api, payload) { var orient = seriesModel.get('orient'); - layoutSankey(nodes, edges, nodeWidth, nodeGap, width, height, iterations, orient); + var nodeAlign = seriesModel.get('nodeAlign'); + + layoutSankey(nodes, edges, nodeWidth, nodeGap, width, height, iterations, orient, nodeAlign); }); } @@ -77,8 +79,8 @@ function getViewRect(seriesModel, api) { ); } -function layoutSankey(nodes, edges, nodeWidth, nodeGap, width, height, iterations, orient) { - computeNodeBreadths(nodes, edges, nodeWidth, width, height, orient); +function layoutSankey(nodes, edges, nodeWidth, nodeGap, width, height, iterations, orient, nodeAlign) { + computeNodeBreadths(nodes, edges, nodeWidth, width, height, orient, nodeAlign); computeNodeDepths(nodes, edges, height, width, nodeGap, iterations, orient); computeEdgeDepths(nodes, orient); } @@ -107,7 +109,7 @@ function computeNodeValues(nodes) { * @param {number} nodeWidth the dx of the node * @param {number} width the whole width of the area to draw the view */ -function computeNodeBreadths(nodes, edges, nodeWidth, width, height, orient) { +function computeNodeBreadths(nodes, edges, nodeWidth, width, height, orient, nodeAlign) { // Used to mark whether the edge is deleted. if it is deleted, // the value is 0, otherwise it is 1. var remainEdges = []; @@ -168,7 +170,9 @@ function computeNodeBreadths(nodes, edges, nodeWidth, width, height, orient) { } } - moveSinksRight(nodes, x, orient); + if (nodeAlign === 'justify' || nodeAlign === 'right') { + moveSinksRight(nodes, x, orient); + } if (orient === 'vertical') { kx = (height - nodeWidth) / (x - 1); diff --git a/src/chart/themeRiver/ThemeRiverSeries.js b/src/chart/themeRiver/ThemeRiverSeries.js index 6d00345..3d47bfc 100644 --- a/src/chart/themeRiver/ThemeRiverSeries.js +++ b/src/chart/themeRiver/ThemeRiverSeries.js @@ -228,7 +228,7 @@ var ThemeRiverSeries = SeriesModel.extend({ /** * Get data indices for show tooltip content - * + * @param {Array.<string>|string} dim single coordinate dimension * @param {number} value axis value * @param {module:echarts/coord/single/SingleAxis} baseAxis single Axis used diff --git a/test/sankey-nodeAlign-left.html b/test/sankey-nodeAlign-left.html new file mode 100644 index 0000000..dc55e9b --- /dev/null +++ b/test/sankey-nodeAlign-left.html @@ -0,0 +1,93 @@ + + +<!-- +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. +--> + +<html> + <head> + <meta charset="utf-8"> + <meta name="viewport" content="width=device-width, initial-scale=1" /> + <script src="lib/esl.js"></script> + <script src="lib/config.js"></script> + <script src="lib/jquery.min.js"></script> + </head> + <body> + <style> + html, body, #main { + width: 100%; + height: 100%; + /*border: 1px solid #000;*/ + } + </style> + <div id="main"><div> + <script> + require([ + 'echarts' + // 'echarts/chart/sankey', + // 'echarts/component/tooltip' + ], function (echarts) { + + var chart = echarts.init(document.getElementById('main'), null, { + + }); + + window.onresize = function () { + chart.resize(); + }; + + chart.on('click', function (params) { + console.log(params, params.data); + }); + + $.getJSON('./data/energy.json') + .done(function(data) { + + data.nodes[0].itemStyle = { + normal: { + color: 'red' + } + }; + chart.setOption({ + tooltip: { + trigger: 'item', + triggerOn: 'mousemove' + }, + animation: false, + series: [ + { + type: 'sankey', + layout:'none', + focusNodeAdjacency: true, + nodeAlign: 'left', + data: data.nodes, + links: data.links, + lineStyle: { + normal: { + color: 'source', + curveness: 0.5 + } + } + } + ] + }); + }); + }); + </script> + </body> +</html> \ No newline at end of file --------------------------------------------------------------------- To unsubscribe, e-mail: commits-unsubscr...@echarts.apache.org For additional commands, e-mail: commits-h...@echarts.apache.org