[GitHub] [incubator-echarts] Supertramplee commented on issue #3564: [讨论] 关于 Legend 等组件的鼠标事件

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

Supertramplee commented on issue #3564:
URL: https://github.com/apache/incubator-echarts/issues/3564#issuecomment-700473350


   给大家提供一个曲线救国方案...
   
   需求: legend hover时高亮折线图上面的线。 
   Why: 折线是条拟合线，不需要show Symbol, 而当series比较多的时候，线就看不清了。。折线又没法单独highlight...
   
   ![image](https://user-images.githubusercontent.com/10401252/94519313-f70cf380-025c-11eb-9453-0c9a5672e484.png)
   
   
   ```js
   tooltip: {
     trigger: 'item',
     formatter: function(params) {
       // highlight hover series...
       myChart.setOption({
           series:{
               name:params.name,
               lineStyle:{
                   width:8
               }
           }
       })
       // downplay after 800ms..
       setTimeout(()=>{
           myChart.setOption({
           series:{
               name:params.name,
               lineStyle:{
                   width:2
               }
           }
       })
       },800)
       return params.name
     },
     show: true
   }
   ```
   
   最终效果:
   ![hilight](https://user-images.githubusercontent.com/10401252/94519903-f32da100-025d-11eb-9f48-78a50ae90797.gif)
   


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