You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by GitBox <gi...@apache.org> on 2020/07/29 07:28:26 UTC

[GitHub] [incubator-echarts] ayashjorden opened a new issue #13033: Create a link between two series

ayashjorden opened a new issue #13033:
URL: https://github.com/apache/incubator-echarts/issues/13033


   ### Version
   4.8.0
   
   ### Steps to reproduce
   * Create a Graph-Force chart with two Series
   * Create a link between series-1-node-1 to series-2-node-1
   * Render the chart
   * There's no link between the nodes.
   
   ### What is expected?
   Should be able to linked nodes between two series
   
   ### What is actually happening?
   Cannot reference nodes between two series.
   
   ---
   Opened a StackOverflow question here - https://stackoverflow.com/questions/62889878/echarts-nested-directed-graph
   
   Example config:
   ```typescript
   generateDag() {
       this.testDag = echarts.init(document.getElementById(`dag`) as HTMLDivElement);
   
       const chartWidth = this.testDag.getWidth();
   
       const nodes1 = [
         { name: 'AUDIT.n1', value: 10 },
         { name: 'AUDIT.n2', value: 10 },
         { name: 'AUDIT.n3', value: 10 },
       ];
   
       const links1 = [
         { source: 0, target: 1, value: 10 },
         { source: 'AUDIT.n2', target: 'AUDIT.n3', value: 10 },
         { source: 'AUDIT.n2', target: 'DEPLOYMENT.n3', value: 10 }
       ];
   
       const nodes2 = [
         { name: 'DEPLOYMENT.n1', value: 10 },
         { name: 'DEPLOYMENT.n2', value: 10 },
         { name: 'DEPLOYMENT.n3', value: 10 },
       ];
   
       const links2 = [
         { source: 'DEPLOYMENT.n1', target: 'DEPLOYMENT.n2', value: 10 },
         { source: 'DEPLOYMENT.n2', target: 'DEPLOYMENT.n3', value: 10 }
       ];
   
       const minNodeSize = 15;
       const maxNodeSize = 75;
       const nodeSize = (chartWidth - 15) / ((nodes1.length + nodes2.length) * 10);
   
       const edgeLength = nodeSize < minNodeSize ? 25 : nodeSize * 3;
       const repulsion = nodeSize < minNodeSize ? 25 : nodeSize * 10;
       const gravity = nodeSize < minNodeSize ? 0.3 : 0.2;
   
       let symbolSize: number;
   
       if (nodeSize <= minNodeSize) {
         symbolSize = minNodeSize;
       } else if (nodeSize > minNodeSize && nodeSize <= maxNodeSize) {
         symbolSize = nodeSize;
       } else {
         symbolSize = maxNodeSize;
       }
   
       console.log(
         'chartWidth', chartWidth,
         'nodes1.length', nodes1.length,
         'nodeSize', nodeSize,
         'edgeLength', edgeLength,
         'repultion', repulsion,
         'symbolSize', symbolSize,
         'gravity', gravity
       );
   
       const options = {
         tooltip: {},
         animation: false,
         title: {
           text: 'test view',
           subtext: 'Default layout',
           top: 'bottom',
           left: 'right'
         },
         animationDuration: 1500,
         animationEasingUpdate: 'quinticInOut',
         series: [{
           name: 'CREATE',
           id: 'CREATE',
           symbolSize,
           type: 'graph',
           layout: 'force',
           force: {
             edgeLength,
             repulsion,
             gravity
           },
           data: nodes1,
           links: links1,
           // categories: categories,
           roam: 'move',
           draggable: true,
           focusNodeAdjacency: true,
           symbolKeepAspect: true,
           itemStyle: {
             borderColor: '#fff',
             borderWidth: 1,
             shadowBlur: 10,
             shadowColor: 'rgba(0, 0, 0, 0.3)'
           },
           label: {
             position: 'right',
             formatter: '{b}'
           },
           lineStyle: {
             color: 'source',
             curveness: 0.3
           },
           emphasis: {
             lineStyle: {
               width: 10
             }
           }
         },
         {
           name: 'DEPLOYMENT',
           id: 'DEPLOYMENT',
           symbolSize,
           type: 'graph',
           layout: 'force',
           force: {
             edgeLength,
             repulsion,
             gravity
           },
           data: nodes2,
           links: links2,
           // categories: categories,
           roam: 'move',
           draggable: true,
           focusNodeAdjacency: true,
           symbolKeepAspect: true,
           itemStyle: {
             borderColor: '#fff',
             borderWidth: 1,
             shadowBlur: 10,
             shadowColor: 'rgba(0, 0, 0, 0.3)'
           },
           label: {
             position: 'right',
             formatter: '{b}'
           },
           lineStyle: {
             color: 'source',
             curveness: 0.3
           },
           emphasis: {
             lineStyle: {
               width: 10
             }
           }
         }
         ]
       };
       this.testDag.setOption(options);
       this.testDag.resize();
     }
   ```
   <!-- This issue is generated by echarts-issue-helper. DO NOT REMOVE -->
   <!-- This issue is in English. DO NOT REMOVE -->


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org


[GitHub] [incubator-echarts] ayashjorden commented on issue #13033: Create a link between two series

Posted by GitBox <gi...@apache.org>.
ayashjorden commented on issue #13033:
URL: https://github.com/apache/incubator-echarts/issues/13033#issuecomment-666642390


   As explained in [SO](https://stackoverflow.com/questions/62889878/echarts-nested-directed-graph), ECharts currently doesn't support flowcharts.
   So it would be great to have a feature-request for that.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org


[GitHub] [incubator-echarts] echarts-bot[bot] commented on issue #13033: Create a link between two series

Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on issue #13033:
URL: https://github.com/apache/incubator-echarts/issues/13033#issuecomment-664787840


   Hi! We've received your issue and please be patient to get responded. 🎉
   The average response time is expected to be within one day for weekdays.
   
   In the meanwhile, please make sure that **you have posted enough image to demo your request**. You may also check out the [API](http://echarts.apache.org/api.html) and [chart option](http://echarts.apache.org/option.html) to get the answer.
   
   If you don't get helped for a long time (over a week) or have an urgent question to ask, you may also send an email to dev@echarts.apache.org. Please attach the issue link if it's a technical questions.
   
   If you are interested in the project, you may also subscribe our [mail list](https://echarts.apache.org/en/maillist.html).
   
   Have a nice day! 🍵


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org