[GitHub] Allowack commented on issue #5391: 多个legend设置selected时，legend需要单击两次才能切换状态

[GitBox <gi...@apache.org>]

Allowack commented on issue #5391: 多个legend设置selected时，legend需要单击两次才能切换状态
URL: https://github.com/apache/incubator-echarts/issues/5391#issuecomment-405489943
 
 
   第一个legend 设置成single时候，第二个legend 点击就会失效。
   第一个legend 设置成multile时候，第二个lengend 需要双击才能生效。
   4.1.0RC2版本。
   `app.title = '柱状图框选';
   
   var xAxisData = [];
   var data1 = [];
   var data2 = [];
   var data3 = [];
   var data4 = [];
   
   for (var i = 0; i < 10; i++) {
       xAxisData.push('Class' + i);
       data1.push((Math.random() * 2).toFixed(2));
       data2.push(-Math.random().toFixed(2));
       data3.push((Math.random() * 5).toFixed(2));
       data4.push((Math.random() + 0.3).toFixed(2));
   }
   
   var itemStyle = {
       normal: {
       },
       emphasis: {
           barBorderWidth: 1,
           shadowBlur: 10,
           shadowOffsetX: 0,
           shadowOffsetY: 0,
           shadowColor: 'rgba(0,0,0,0.5)'
       }
   };
   
   option = {
       backgroundColor: '#eee',
       legend:[ {
           data: ['bar', 'bar2'],
           selectedMode:'multile',
           align: 'left',
           left: 10
       },{
           data: ['bar3', 'bar4'],
           selectedMode: 'single',
           bottom:1,
           left: 10
       }],
       brush: {
           toolbox: ['rect', 'polygon', 'lineX', 'lineY', 'keep', 'clear'],
           xAxisIndex: 0
       },
       toolbox: {
           feature: {
               magicType: {
                   type: ['stack', 'tiled']
               },
               dataView: {}
           }
       },
       tooltip: {},
       xAxis: {
           data: xAxisData,
           name: 'X Axis',
           silent: false,
           axisLine: {onZero: true},
           splitLine: {show: false},
           splitArea: {show: false}
       },
       yAxis: {
           inverse: true,
           splitArea: {show: false}
       },
       grid: {
           left: 100
       },
       visualMap: {
           type: 'continuous',
           dimension: 1,
           text: ['High', 'Low'],
           inverse: true,
           itemHeight: 200,
           calculable: true,
           min: -2,
           max: 6,
           top: 60,
           left: 10,
           inRange: {
               colorLightness: [0.4, 0.8]
           },
           outOfRange: {
               color: '#bbb'
           },
           controller: {
               inRange: {
                   color: '#2f4554'
               }
           }
       },
       series: [
           {
               name: 'bar',
               type: 'bar',
               stack: 'one',
               itemStyle: itemStyle,
               data: data1
           },
           {
               name: 'bar2',
               type: 'bar',
               stack: 'one',
               itemStyle: itemStyle,
               data: data2
           },
           {
               name: 'bar3',
               type: 'bar',
               stack: 'two',
               itemStyle: itemStyle,
               data: data3
           },
           {
               name: 'bar4',
               type: 'bar',
               stack: 'two',
               itemStyle: itemStyle,
               data: data4
           }
       ]
   };
   
   myChart.on('brushSelected', renderBrushed);
   
   function renderBrushed(params) {
       var brushed = [];
       var brushComponent = params.batch[0];
   
       for (var sIdx = 0; sIdx < brushComponent.selected.length; sIdx++) {
           var rawIndices = brushComponent.selected[sIdx].dataIndex;
           brushed.push('[Series ' + sIdx + '] ' + rawIndices.join(', '));
       }
   
       myChart.setOption({
           title: {
               backgroundColor: '#333',
               text: 'SELECTED DATA INDICES: \n' + brushed.join('\n'),
               bottom: 0,
               right: 0,
               width: 100,
               textStyle: {
                   fontSize: 12,
                   color: '#fff'
               }
           }
       });
   }`

----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on 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


With regards,
Apache Git Services

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