鼠标点击事件示例

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>鼠标点击事件</title>
</head>
<body>

<div id="main" style="width:600px;height:300px;"></div>

<script src="js/echarts.js"></script>

<script>
    var myChart = echarts.init(document.getElementById('main'));

    var option = {
        title:{
            text:'鼠标点击事件'
        },
        tooltip:{},
        legend:{
            data:['销量']
        },
        xAxis:{
            data:["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
        },
        yAxis:{},
        series:[{
            name:'销量',
            type:'bar',
            data:[5,10,25,20,6,8]
        }]
    };
    myChart.setOption(option);

    myChart.on('click',function(params){
       window.open('http://www.baidu.com/s?wd=' + encodeURIComponent(params.name));
   });
</script>
</body>
</html>

 

鼠标点击数据内容就会跳转到百度的搜索中去，比如点击衬衫，就会跳转到百度搜索衬衫的界面

posted @ 2022-02-10 21:12  kuaiquxie  阅读(52)  评论(0)    收藏  举报