Loudxx opened a new issue, #20372:
URL: https://github.com/apache/echarts/issues/20372

   ### Version
   
   e.g.5.5.1
   
   ### Link to Minimal Reproduction
   
   下方示例
   
   ### Steps to Reproduce
   
   <!--
        此示例下载自 
https://echarts.apache.org/examples/zh/editor.html?c=graph-simple&code=MYewdgzgLgBMAWBDATlAIoqiYF4YG8AoGEmAIgBNNEyAuGAbWNJaJfdLLEQFsBTOuWQBXADZ8AtACYyAGmYcWZAG6JRwgfSnzF7MgA9BARgAMO3ZwCegqWYUWyASyh8eAZSiXxgthY5lQURBkQTIAYmBEPgB2ChMye10AX3M_MghLHgAjEFE3RwAvTUZEvxgpW1SykgBmExNSjgBdKt0yKBBcqEcABx9GhwAzYJ5MFxD6MgAdMGqOQHxXQAlTQAB9QGnNQDfTQBfU2lspABYJEyNDoxh62iOLkwAeLOQYAHoAPhm59iXAZb9AfXMtnaN9k4nM4mC5GK63e7PV5vUiAYBjAOXGS0AwMGAF7VIjwegB9CDAPhgPiYxwUGCOWYAChq0SMAEoYIgwMTMQBHYSOYAAa0xokcgyg2IA7s4ECTyTSIY8XrMYSRAEI6gHK_QBgSoBZRMAat6AU1daNcKI5lDBoF4-DgpmRBRQoPB6Ht6j19ABufnwZySCA9RC4-g9ZCSfnIRA9e3BCgSH1--h3PiIdnBwO2kDKPjIQZBfn0RDCDq241PfBJa4PbXKSXSkiAK8DAFnagEk5JWAO39NQW9Z5xEaTUTzZbrXaHU6JC63XwPV7g77_fzA0PQzBw5Ho8gKLH44nk6n0yBM2QnnmC0WYQlqikBkpRIgsnxRP1pel4CB-YIoCI-K0ymQcrOEwB1VvwQR2C-BYKhLIjw5OQD0UMhkDZL96BzUCSCSAZ910Xw0m4fhQjxbpPAkAA2AAOaI9gAVikf5TBqEDqhUNQNFCPCCOI0iTHIx9_EMLQfyfax2JYvQnXcRtimQuYAlyf9JgiKJYniWCYEQp8MmyXJ8iKQQmGlfYOLeK0GmqFoZPaTpRG6PpoJkpRhmQUYoHGUJoWl
 
LZlXVWh8HFKEpWLGBAG8fQBo9UALH-0AAQQASQAGQATVc7cPPWQB_VN83DsO0-objuCU7OLBzVTVXyADEgoADQAUTQTEACEAFU0AAcUKgAVTEADUApC8rCsi9L7M2ZVACHlQAHU180xkuS9r3OLQBC6MAecTAE7TQB4fV8kaPJISbAFVlQBZeXm1K3I83NNqimF0SxTwen7WwUshPa3gOzEeBAChT1oQajAW4srpxPECSJWhKSe3aOqfGS5LSI8TzPUyLwgK8b3oO8NB4toXzu5APzNKCzjhsC_wmchALddkKJ3CCEB8eC9wQnihLaVDijIDDnEsHD8KIkiSKYwr8tqgAlAKKuqur8bSVR1GpuimcYmo2c57nKpq2r-YcNjyk0hwuJgK10ZIJwXH4g1zx3THQgiGoKEGQZyIB9XyAUnI8kKYo1JhDSLZYbSZL0yiOi6XpdbeMgLKsmzJj-6pMqclzftG6UfP84Lwue6K4oSpL6jjjKuqy3KCuKsrpbqxrmtalPOp6_q6iGs60ojmFJtmjbzqDuYVvWwu5h2uvK-qK6jpO5Pw48q6bru0QHvqH62773gsTe_FCQoL6qWbtJzf04HT294SIevW97ydzgEffT9vx3jX9cmHHgKPoRIOJgGyYGCmwKp0I7qwRxRAZ-jmbIuW2kFmjJhFhiLNmL6QVnUC2ZAVaVH0nxDwOswZ61EljcIkQYhxF3GUQGDgrZKVtqpMypBHb4JIIReortwEeyMl7eBPs_ZjATLZduZQQ4ajDmPRaUdAqhQir3RasV4qJTLgvOYzCM5FRKjzGWecWptR4dFNOfUBplx7mwjy1c5pCOqI3WuFdtoaIsJ3Swx0djKJ0S9Ce11br3Ueno3Qr1cTT0-t9Gxegl6URXqDAgRDLaQy3rDLxz5Az7xRoffxJ9sZATxhfcCV9oIkwwbfJC-lH6TGfogV-79RZAIllzCRfNwG_2FozQBZFslS15rLcBoClZtBVmraB
 
WtYHeGocJMJyCjYmzNnucB2CbYqXoPbN4hDpQkJ0mUN2T4KHGTXpRWh1l6GB0YX4ZhzlnG6A4THbhKiMoJwEUNVZigRF5TEdncpUiC6yNTsXXypc9kXOlGo7RW1FpaP2SwVupjpQGKMadV5pB-6WKHtYu5cw7HvRnnPUeHzhKuKfO46Z8kfHQ23v4veSMD70GqU-VpZ9In-MJqjGCpNkj2HGRrbkYA8b9LvvpCAIBhDIFxOhMAmF6YAM_kxb-YEsDIAAOZ8CgEyllGTikcoSYoe-_haX0sZZMEQ4hpCcv8NyvlArJi0ywmysWpTcmyzFRwCVegpUMupuq1lRT2XAPdigFVgq6bCotdqnOurkjkxpXS41tqNXmrFoqvQyr-VP35Wkt-mqgHoI4Jg1gbrpUmuZXa0NJT2Y5Kdb6pQ_rVXkFSekhNrMk1lJluG9gcSSCkvIJYAK-hHAQDwW0QANN6ABi5GUgAQjMAOneypfVkFrYAADlm1tqVIWpohB4KEEICAHo3RwC4E8boekjgrKOHAPQQYagIAPgGJM3ozSOAbxTDAGGa6XUDB5RBWe06LDiF5PQQa6MII8vgFADF6MOg9HoGA0CORrIgB4K-zFcEeL6ArVWrd7Ad1LpXQeiwXd6AAHICnQZ4pG0g5bK0QGAywKDMBoORBcDy4Ilh4OgSoFgegCAUDoGoAAOmQ1W9GLpuRQBCqSfsZ6_Cgb3feUCxai08VXRBPgqGSh-ANehwxzHoPHr9PAAj1Qekwa9MAKA0mygPAeHATos5SSYD4G4Sw0BXAwciKgfjjh6RSAoEpvwF6H0wFLhbZ9V6SEWw_R0b9MAjBvuqLe-97Ff3sCPJYOl1noNgHAHwCzFg-AUD5TpxSQ9GBYccAy8Q8HMMoGQNeaDpbdAwIEmh7jMkiOIBI0gVAGAsAUcKxbcl7IBOkdK5R6rVWmONOY8J9gpo2xuYo4RHeY63R0yvTvTGMHj18HwxbRDbyeJZdkr
 aIAA
        ⚠ 请注意,该图表不是 Apache ECharts 官方示例,而是由用户代码生成的。请注意鉴别其内容。
   -->
   <!DOCTYPE html>
   <html lang="en" style="height: 100%">
   <head>
     <meta charset="utf-8">
   </head>
   <body style="height: 100%; margin: 0">
     <div id="container" style="height: 100%"></div>
   
     
     <script type="text/javascript" 
src="https://registry.npmmirror.com/echarts/5.5.1/files/dist/echarts.min.js";></script>
     
     <!-- Uncomment this line if you want to dataTool extension
     <script type="text/javascript" 
src="https://registry.npmmirror.com/echarts/5.5.1/files/dist/extension/dataTool.min.js";></script>
     -->
     <!-- Uncomment this line if you want to use gl extension
     <script type="text/javascript" 
src="https://registry.npmmirror.com/echarts-gl/2/files/dist/echarts-gl.min.js";></script>
     -->
     <!-- Uncomment this line if you want to echarts-stat extension
     <script type="text/javascript" 
src="https://registry.npmmirror.com/echarts-stat/latest/files/dist/ecStat.min.js";></script>
     -->
     <!-- Uncomment this line if you want to echarts-graph-modularity extension
     <script type="text/javascript" 
src="https://registry.npmmirror.com/echarts-graph-modularity/2/files/dist/echarts-graph-modularity.min.js";></script>
     -->
     <!-- Uncomment this line if you want to use map
     <script type="text/javascript" 
src="https://registry.npmmirror.com/echarts/4.9.0/files/map/js/world.js";></script>
     -->
     <!-- Uncomment these two lines if you want to use bmap extension
     <script type="text/javascript" 
src="https://api.map.baidu.com/api?v=3.0&ak=YOUR_API_KEY";></script>
     <script type="text/javascript" 
src="https://registry.npmmirror.com/echarts/5.5.1/files/dist/extension/bmap.min.js";></script>
     -->
   
     <script type="text/javascript">
       var dom = document.getElementById('container');
       var myChart = echarts.init(dom, null, {
         renderer: 'canvas',
         useDirtyRect: false
       });
       var app = {};
       
       var option;
   
       const chartData = {
       "data": [
           {
               "id": "rule-2",
               "name": "rule-2",
               "value": 2,
               "x": 10,
               "y": 20,
               "itemStyle": {
                   "color": "#cae7d0"
               },
               "symbolSize": [
                   220,
                   300
               ],
               "tooltip": {
                   "formatter": "\n                  生效开始时间:2024-01-01 
00:01:00<br />\n                  生效结束时间:2124-01-01 00:01:00<br />\n            
      调控生效范围camp_scene_id in (371) and _quick_lift_switch in (1)<br />\n        
          层级分配策略:<div style=\"width: 400px;white-space: pre-wrap;word-wrap: 
break-word;overflow: auto;\">{}</div>\n                  自定义配置:<div 
style=\"width: 400px;white-space: pre-wrap;word-wrap: break-word;overflow: 
auto;\"></div>\n                "
               },
               "label": {
                   "show": true,
                   "borderWidth": 0,
                   "color": "black",
                   "rich": {}
               }
           },
           {
               "id": "entity-68745212103",
               "name": "entity-68745212103",
               "value": "68745212103",
               "x": 20,
               "y": 20,
               "itemStyle": {
                   "color": "#cae7d0"
               },
               "symbolSize": [
                   240,
                   400
               ],
               "tooltip": {
                   "formatter": "\n                  时间分配策略:{<br />\n           
         类型:DAILY<br />\n                    时长:86400000<br />\n                
    时间分配策略:FIXED_BUDGET_VALUE<br />\n                    时间分配参数:10000000<br 
/>\n                    计量方式:<br />\n                    计量单位:<br />\n          
        }<br />\n                  camp_type:200<br />\n                  
camp_model:1001<br />\n                  camp_scene_id:371<br />\n              
  "
               },
               "label": {
                   "show": true,
                   "borderWidth": 0,
                   "color": "black",
                   "rich": {}
               }
           },
           {
               "id": "entity-68745212103EXTRABUDGET",
               "name": "entity-68745212103EXTRABUDGET",
               "value": "68745212103EXTRABUDGET",
               "x": 20,
               "y": 40,
               "itemStyle": {
                   "color": "#c3dff3"
               },
               "symbolSize": [
                   240,
                   400
               ],
               "tooltip": {
                   "formatter": "\n                  时间分配策略:{<br />\n           
         类型:DAILY<br />\n                    时长:86400000<br />\n                
    时间分配策略:FIXED_BUDGET_VALUE<br />\n                    时间分配参数:3000000<br />\n 
                   计量方式:<br />\n                    计量单位:<br />\n               
   }<br />\n                  camp_type:200<br />\n                  
camp_model:1001<br />\n                  camp_scene_id:371<br />\n              
  "
               },
               "label": {
                   "show": true,
                   "borderWidth": 0,
                   "color": "black",
                   "rich": {}
               }
           },
           {
               "id": "detail-68745212103",
               "name": "detail-68745212103",
               "value": "68745212103",
               "x": 30,
               "y": 20,
               "itemStyle": {
                   "color": "#cae7d0"
               },
               "symbolSize": [
                   240,
                   500
               ],
               "tooltip": {
                   "formatter": "\n                  时间分配策略:{<br />\n           
         类型:DAILY<br />\n                    时长:86400000<br />\n                
    时间分配策略:FIXED_BUDGET_VALUE<br />\n                    时间分配参数:10000000<br 
/>\n                    计量方式:<br />\n                    计量单位:<br />\n          
        }<br />\n                  camp_type:200<br />\n                  
camp_model:1001<br />\n                  camp_scene_id:371<br />\n              
  "
               },
               "label": {
                   "show": true,
                   "borderWidth": 0,
                   "color": "black",
                   "rich": {}
               }
           },
           {
               "id": "detail-68745212103EXTRABUDGET",
               "name": "detail-68745212103EXTRABUDGET",
               "value": "68745212103EXTRABUDGET",
               "x": 30,
               "y": 40,
               "itemStyle": {
                   "color": "#c3dff3"
               },
               "symbolSize": [
                   240,
                   500
               ],
               "tooltip": {
                   "formatter": "\n                  时间分配策略:{<br />\n           
         类型:DAILY<br />\n                    时长:86400000<br />\n                
    时间分配策略:FIXED_BUDGET_VALUE<br />\n                    时间分配参数:3000000<br />\n 
                   计量方式:<br />\n                    计量单位:<br />\n               
   }<br />\n                  camp_type:200<br />\n                  
camp_model:1001<br />\n                  camp_scene_id:371<br />\n              
  "
               },
               "label": {
                   "show": true,
                   "borderWidth": 0,
                   "color": "black",
                   "rich": {}
               }
           }
       ],
       "link": [
           {
               "source": "rule-2",
               "target": "entity-68745212103EXTRABUDGET"
           },
           {
               "source": "entity-68745212103",
               "target": "entity-68745212103EXTRABUDGET"
           },
           {
               "source": "entity-68745212103",
               "target": "detail-68745212103",
           },
           {
               "source": "entity-68745212103EXTRABUDGET",
               "target": "detail-68745212103EXTRABUDGET"
           }
       ],
       "yAxis": [
           "第二层预算分配",
           "第一层预算分配"
       ]
   }
   
   
   option = {
           animation: false,
           tooltip: {
             show: true,
           },
           grid: {
             left: 100,
             right: 0,
             top: 30,
             bottom: 30,
           },
           xAxis: {
             show: false,
             type: 'category',
           },
           yAxis: {
             type: 'category',
             data: chartData.yAxis,
             splitLine: {
               show: true
             }
           },
           series: [
             {
               type: 'graph',
               symbol: 'rect',
               // coordinateSystem: 'cartesian2d',
               left: 300,
               top: 150,
               bottom: 130,
               right: 200,
               layout: 'none',
               edgeSymbol: ['arrow'],
               itemStyle: {
               },
               data: chartData.data,
               links: chartData.link,
               lineStyle: {
                 width: 1.5,
                 opacity: 1,
                 color: 'grey',
               },
             },
           ],
         };
   
       if (option && typeof option === 'object') {
         myChart.setOption(option);
       }
   
       window.addEventListener('resize', myChart.resize);
     </script>
   </body>
   </html>
   
   ### Current Behavior
   
   连线有的正向,有的反向
   
   ### Expected Behavior
   
   连线节点正向
   
   ### Environment
   
   ```markdown
   - OS: 
   - Browser: google
   - Framework: none
   ```
   
   
   ### Any additional comments?
   
   _No response_


-- 
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.

To unsubscribe, e-mail: [email protected]

For queries about this service, please contact Infrastructure at:
[email protected]


---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]

Reply via email to