首页 > 其他 > 详细

Echarts柱状图点击事件的实现方法

时间:2021-02-01 14:51:45      阅读:117      评论:0      收藏:0      [点我收藏+]

点击事件绑定

click事件

onChartClick=(param,echarts)=>{

    console.log(param)

}

render(){

    let onEvents={

        ‘click‘: this.onChartClick

    }

    return(

            <ReactEcharts

                option={this.getOption()} 

                notMerge={true}

                lazyUpdate={true}

                onEvents={onEvents}

                style={{width: ‘100%‘,height:‘100%‘}}

            />
    )

}

 

legend标签点击事件

onChartLegendselectchanged=(param,echarts)=>{

    console.log(param)

}

render(){

    let onEvents={

        ‘legendselectchanged‘: this.onChartLegendselectchanged

    }

    return(

            <ReactEcharts

                option={this.getOption()} 

                notMerge={true}

                lazyUpdate={true}

                onEvents={onEvents}

                style={{width: ‘100%‘,height:‘100%‘}}

            />

    )

}

 

一、安装

npm install --save echarts-for-react
//如果需要使用echarts的一些特殊方法需要安装
npm install --save echarts

二、使用

import ReactEcharts from ‘echarts-for-react‘;
import echarts from ‘echarts‘;

<ReactEcharts
    option={this.getOption()} 
    notMerge={true}
    lazyUpdate={true}
    onEvents={onEvents}
    style={{width:100%‘,height:100%‘}}
/>

Echarts柱状图点击事件的实现方法

原文:https://www.cnblogs.com/ningmengya/p/14356319.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!