This is an automated email from the ASF dual-hosted git repository. deqingli pushed a commit to branch dev in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git
commit ef25a6b3bf4c7ddf886128a8bb24c26aec7a4b54 Author: deqingli <annong...@gmail.com> AuthorDate: Wed May 2 19:16:22 2018 +0800 update the focus node adjacency interactive --- src/chart/sankey/SankeyView.js | 10 +- test/sankey-test.html | 317 ++++++++++++++++++++--------------------- test/sankey.html | 1 + 3 files changed, 160 insertions(+), 168 deletions(-) diff --git a/src/chart/sankey/SankeyView.js b/src/chart/sankey/SankeyView.js index 5068f31..3bfcf75 100644 --- a/src/chart/sankey/SankeyView.js +++ b/src/chart/sankey/SankeyView.js @@ -294,7 +294,7 @@ export default echarts.extendChartView({ var itemModel = data.getItemModel(dataIndex); var edgeDataIndex = payload.edgeDataIndex; - if (!dataIndex && !edgeDataIndex) { + if (dataIndex == null && edgeDataIndex == null) { return; } var node = graph.getNodeByIndex(dataIndex); @@ -309,8 +309,8 @@ export default echarts.extendChartView({ if (node) { fadeInItem(node, nodeOpacityPath); - var focusNodeAdjacency = itemModel.get('focusNodeAdjacency'); - if (focusNodeAdjacency === 'outEdges') { + var focusNodeAdj = itemModel.get('focusNodeAdjacency'); + if (focusNodeAdj === 'outEdges') { zrUtil.each(node.outEdges, function (edge) { if (edge.dataIndex < 0) { return; @@ -319,7 +319,7 @@ export default echarts.extendChartView({ fadeInItem(edge.node2, nodeOpacityPath); }); } - else if (focusNodeAdjacency === 'inEdges') { + else if (focusNodeAdj === 'inEdges') { zrUtil.each(node.inEdges, function (edge) { if (edge.dataIndex < 0) { return; @@ -328,7 +328,7 @@ export default echarts.extendChartView({ fadeInItem(edge.node1, nodeOpacityPath); }); } - else if (focusNodeAdjacency === 'allEdges') { + else if (focusNodeAdj === 'allEdges') { zrUtil.each(node.edges, function (edge) { if (edge.dataIndex < 0) { return; diff --git a/test/sankey-test.html b/test/sankey-test.html index f7df01c..336c70b 100644 --- a/test/sankey-test.html +++ b/test/sankey-test.html @@ -16,178 +16,169 @@ </style> <div id="main"><div> <script> - require([ - 'echarts' - // 'echarts/chart/sankey', - // 'echarts/component/tooltip' - ], function (echarts) { + require(['echarts'], function (echarts) { - var chart = echarts.init(document.getElementById('main'), null, { + var chart = echarts.init(document.getElementById('main'), null, {}); - }); + window.onresize = function () { + chart.resize(); + }; - window.onresize = function () { - chart.resize(); - }; + // var data = { + // nodes: [ + // {name: 'Brazil'}, + // {name: 'Canada'}, + // {name: 'Mexico'}, + // {name: 'USA'}, + // {name: 'Portugal'}, + // {name: 'France'}, + // {name: 'Spain'}, + // {name: 'England'}, + // {name: 'Angola'}, + // {name: 'Senegal'}, + // {name: 'Morocco'}, + // {name: 'South Africa'}, + // {name: 'Mali'}, + // {name: 'China'}, + // {name: 'India'}, + // {name: 'Japan'} + // ], + // links: [ + // {source: 'Brazil', target: 'Portugal', value: 5}, + // {source: 'Brazil', target: 'France', value: 1}, + // {source: 'Brazil', target: 'Spain', value: 1}, + // {source: 'Brazil', target: 'England', value: 1}, + // {source: 'Canada', target: 'Portugal', value: 1}, + // {source: 'Canada', target: 'France', value: 5}, + // {source: 'Canada', target: 'England', value: 1}, + // {source: 'Mexico', target: 'Portugal', value: 1}, + // {source: 'Mexico', target: 'France', value: 1}, + // {source: 'Mexico', target: 'Spain', value: 5}, + // {source: 'Mexico', target: 'England', value: 1}, + // {source: 'USA', target: 'Portugal', value: 1}, + // {source: 'USA', target: 'France', value: 1}, + // {source: 'USA', target: 'Spain', value: 1}, + // {source: 'USA', target: 'England', value: 5}, + // {source: 'Portugal', target: 'Angola', value: 2}, + // {source: 'Portugal', target: 'Senegal', value: 1}, + // {source:'Portugal', target: 'Morocco', value: 1}, + // {source: 'Portugal', target: 'South Africa', value: 3}, + // {source: 'France', target: 'Angola', value: 1}, + // {source: 'France', target: 'Senegal', value: 3}, + // {source: 'France', target: 'Mali', value: 3}, + // {source: 'France', target: 'Morocco', value: 3}, + // {source: 'France', target: 'South Africa', value: 1}, + // {source: 'Spain', target: 'Senegal', value: 1}, + // {source: 'Spain', target: 'Morocco', value: 3}, + // {source: 'Spain', target: 'South Africa', value: 1}, + // {source: 'England', target: 'Angola', value: 1}, + // {source: 'England', target: 'Senegal', value: 1}, + // {source: 'England', target: 'Morocco', value: 2}, + // {source: 'England', target: 'South Africa', value: 7}, + // {source: 'South Africa', target: 'China', value: 5}, + // {source: 'South Africa', target: 'India', value: 1}, + // {source: 'South Africa', target: 'Japan', value: 3}, + // {source: 'Angola', target: 'China', value: 5}, + // {source: 'Angola', target: 'India', value: 1}, + // {source: 'Angola', target: 'Japan', value: 3}, + // {source: 'Senegal', target: 'China', value: 5}, + // {source: 'Senegal', target: 'India', value: 1}, + // {source: 'Senegal', target: 'Japan', value: 3}, + // {source: 'Mali', target: 'China', value: 5}, + // {source: 'Mali', target: 'India', value: 1}, + // {source: 'Mali', target: 'Japan', value: 3}, + // {source: 'Morocco', target: 'China', value: 5}, + // {source: 'Morocco', target: 'India', value: 1}, + // {source: 'Morocco', target: 'Japan', value: 3} + // ] + // }; - // chart.on('click', function (params) { - // console.log(params, params.data); - // }); - - // var data = { - // nodes: [ - // {name: 'Brazil'}, - // {name: 'Canada'}, - // {name: 'Mexico'}, - // {name: 'USA'}, - // {name: 'Portugal'}, - // {name: 'France'}, - // {name: 'Spain'}, - // {name: 'England'}, - // {name: 'Angola'}, - // {name: 'Senegal'}, - // {name: 'Morocco'}, - // {name: 'South Africa'}, - // {name: 'Mali'}, - // {name: 'China'}, - // {name: 'India'}, - // {name: 'Japan'} - // ], - // links: [ - // {source: 'Brazil', target: 'Portugal', value: 5}, - // {source: 'Brazil', target: 'France', value: 1}, - // {source: 'Brazil', target: 'Spain', value: 1}, - // {source: 'Brazil', target: 'England', value: 1}, - // {source: 'Canada', target: 'Portugal', value: 1}, - // {source: 'Canada', target: 'France', value: 5}, - // {source: 'Canada', target: 'England', value: 1}, - // {source: 'Mexico', target: 'Portugal', value: 1}, - // {source: 'Mexico', target: 'France', value: 1}, - // {source: 'Mexico', target: 'Spain', value: 5}, - // {source: 'Mexico', target: 'England', value: 1}, - // {source: 'USA', target: 'Portugal', value: 1}, - // {source: 'USA', target: 'France', value: 1}, - // {source: 'USA', target: 'Spain', value: 1}, - // {source: 'USA', target: 'England', value: 5}, - // {source: 'Portugal', target: 'Angola', value: 2}, - // {source: 'Portugal', target: 'Senegal', value: 1}, - // {source:'Portugal', target: 'Morocco', value: 1}, - // {source: 'Portugal', target: 'South Africa', value: 3}, - // {source: 'France', target: 'Angola', value: 1}, - // {source: 'France', target: 'Senegal', value: 3}, - // {source: 'France', target: 'Mali', value: 3}, - // {source: 'France', target: 'Morocco', value: 3}, - // {source: 'France', target: 'South Africa', value: 1}, - // {source: 'Spain', target: 'Senegal', value: 1}, - // {source: 'Spain', target: 'Morocco', value: 3}, - // {source: 'Spain', target: 'South Africa', value: 1}, - // {source: 'England', target: 'Angola', value: 1}, - // {source: 'England', target: 'Senegal', value: 1}, - // {source: 'England', target: 'Morocco', value: 2}, - // {source: 'England', target: 'South Africa', value: 7}, - // {source: 'South Africa', target: 'China', value: 5}, - // {source: 'South Africa', target: 'India', value: 1}, - // {source: 'South Africa', target: 'Japan', value: 3}, - // {source: 'Angola', target: 'China', value: 5}, - // {source: 'Angola', target: 'India', value: 1}, - // {source: 'Angola', target: 'Japan', value: 3}, - // {source: 'Senegal', target: 'China', value: 5}, - // {source: 'Senegal', target: 'India', value: 1}, - // {source: 'Senegal', target: 'Japan', value: 3}, - // {source: 'Mali', target: 'China', value: 5}, - // {source: 'Mali', target: 'India', value: 1}, - // {source: 'Mali', target: 'Japan', value: 3}, - // {source: 'Morocco', target: 'China', value: 5}, - // {source: 'Morocco', target: 'India', value: 1}, - // {source: 'Morocco', target: 'Japan', value: 3} - // ] - // }; + var testData = { + nodes: [ + { + name: 'a' + }, + { + name: 'b' + }, + { + name: 'a1' + }, + { + name: 'b1' + }, + { + name: 'c' + }, + { + name: 'e' + } + ], + links: [ + { + source: 'a', + target: 'a1', + value: 5 + }, + { + source: 'e', + target: 'b', + value: 3 + }, + { + source: 'a', + target: 'b1', + value: 3 + }, + { + source: 'b1', + target: 'a1', + value: 1 + }, + { + source: 'b1', + target: 'c', + value: 2 + }, + { + source: 'b', + target: 'c', + value: 1 + } + ] + }; - var testData = { - nodes: [ - { - name: 'a' - }, - { - name: 'b' - }, - { - name: 'a1' + chart.setOption({ + color: ['#67001f', '#b2182b', '#d6604d', '#f4a582', '#fddbc7', '#d1e5f0', '#92c5de', '#4393c3', '#2166ac', '#053061'], + tooltip: { + trigger: 'item', + triggerOn: 'mousemove' + }, + animation: false, + series: [ + { + type: 'sankey', + layout:'none', + bottom: '10%', + // focusNodeAdjacency: 'allEdges', + data: testData.nodes, + links: testData.links, + label: { + position: 'left' }, - { - name: 'b1' - }, - { - name: 'c' - }, - { - name: 'e' - } - ], - links: [ - { - source: 'a', - target: 'a1', - value: 5 - }, - { - source: 'e', - target: 'b', - value: 3 - }, - { - source: 'a', - target: 'b1', - value: 3 - }, - { - source: 'b1', - target: 'a1', - value: 1 - }, - { - source: 'b1', - target: 'c', - value: 2 - }, - { - source: 'b', - target: 'c', - value: 1 - } - ] - }; - - chart.setOption({ - color: ['#67001f', '#b2182b', '#d6604d', '#f4a582', '#fddbc7', '#d1e5f0', '#92c5de', '#4393c3', '#2166ac', '#053061'], - tooltip: { - trigger: 'item', - triggerOn: 'mousemove' - }, - animation: false, - series: [ - { - type: 'sankey', - layout:'none', - bottom: '10%', - data: testData.nodes, - links: testData.links, - label: { - position: 'left' - }, - // Used to test when the data is null whether it is work well. - // data: [], - // links: [], - lineStyle: { - normal: { - color: 'source', - curveness: 0.5 - } + // Used to test when the data is null whether it is work well. + // data: [], + // links: [], + lineStyle: { + normal: { + color: 'source', + curveness: 0.5 } } - ] - }); + } + ] }); + }); </script> </body> </html> \ No newline at end of file diff --git a/test/sankey.html b/test/sankey.html index d8dec76..a2f7332 100644 --- a/test/sankey.html +++ b/test/sankey.html @@ -53,6 +53,7 @@ { type: 'sankey', layout:'none', + focusNodeAdjacency: 'allEdges', data: data.nodes, links: data.links, lineStyle: { -- To stop receiving notification emails like this one, please contact deqin...@apache.org. --------------------------------------------------------------------- To unsubscribe, e-mail: commits-unsubscr...@echarts.apache.org For additional commands, e-mail: commits-h...@echarts.apache.org