[GitHub] [echarts] ragava28 opened a new issue, #18667: [Feature] Ability to connect a chart with other charts by X & Y axis data.

["ragava28 (via GitHub)" <gi...@apache.org>]

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

   ### What problem does this feature solve?
   
   At preset ,we can connect the charts ,  connected functionalities like zoom & tool tips reacts for both X & Y . which works like charm. addition to that would be controlling connection based on individual axis  .
   
   https://codepen.io/ragava28/pen/oNampeL
   
   in above example 
   
   Chart 1 is union of  Depth & Time which are also axis for Chart 2 (x-axis -time) & Chart3(Yaxis depth).
   
   So when Zoom Or hover on the Chart1 : 
   > Chart 2 should react to Chart1 x values,  as time is connection context,
   > Chart 3 should react to Chart1 y values,  as depth is connection context,
   
   when zoom & hover on Chart 1, connected charts will react to connected context. 
   
   in above example we cannot achieve this.
   
   ### What does the proposed API look like?
   
   **Chart 1 Options** 
   
   var option1 = {
     xAxis: {
       type: 'value',   
     },
     yAxis: {
       type: 'value'
     },
     series: [{
       type: 'scatter',
       data: data
     }]
   };
   
   
   **Chart 2 Options** 
   
   var option2 = {
     xAxis: {
       type: 'value',    
       **linkedXAxis: 0 // Connect to the x-axis with index 0 (chart1's x-axis)**
     },
     yAxis: {
       type: 'value'
     },
     series: [{
       type: 'line',
       data: data
     }]
   };
   
   
   **Chart 3 Options** 
   
   var option3 = {
     xAxis: {
       type: 'value'
     },
     yAxis: {
       type: 'value',  
       **linkedYAxis: 0 // Connect to the y-axis with index 0 (chart1's y-axis)**
     },
     series: [{
       type: 'line',
       data: data
     }]
   };
   
   
   
   chart1.setOption(option1);
   chart2.setOption(option2);
   chart3.setOption(option3);
   chart1.group = "group1";
   chart2.group = "group1";
   chart3.group = "group1";
   echarts.connect("group1");


-- 
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: commits-unsubscribe@echarts.apache.org.apache.org

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