代码之家 › 专栏 › 技术社区 › Ethan Arti Singh

事件中键单击饼图切片?

highcharts javascript

Ethan Arti Singh · 技术社区 · 6 年前

我做这个测试是为了证明 console.log 当你中击一个切片,但是有一个当你 控制 点击 ,或常规 点击

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'pie'
        },
        
        plotOptions: {
            series: {
                cursor: 'pointer',
                point: {
                    events: {
                        click: function() {
                            console.log('clicked on y: ' + this.y);
                        },
                    }
                }
            }
        },
        
        series: [{
            data: [{
                y: 29.9
            }, {
                y: 71.5
            }, {
                y: 106.4
            }]        
        }]
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>

<div id="container" style="height: 400px"></div>

当我中键单击饼图切片时,是否有方法触发事件?

1 回复 | 直到 6 年前

Ashu 6 年前

highchart提供的其他默认事件 click ,也可以在容器上附加事件。如果你是这样的话 mousedown

Attach event to container

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'pie'
        },
        
        plotOptions: {
            series: {
                cursor: 'pointer',                
            }
        },
        
        series: [{
            data: [{
                y: 29.9
            }, {
                y: 71.5
            }, {
                y: 106.4
            }]        
        }]
    });
});

$(document).on('mousedown', '#container path', function (e) {
    if(e.which==2)
     console.log('Middle click on slice '+e.target.point.x+ " value is "+e.target.point.y);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>

<div id="container" style="height: 400px"></div>

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

4 月前

Niobos · 如何/是否有方法使通用算法函数同时与同步和异步函数一起工作?

4 月前

Alex · 在轻量级中同时解构和不解构变量

4 月前

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

4 月前

bairog · 从按属性筛选的对象数组字典中创建值数组

5 月前

KaiMcKiernan · 基于Math.random()的函数在另一个函数内不起作用[关闭]

5 月前

David Jeong · 浏览器不会为浏览器自动添加的某些标头发送CORS预检请求吗?

5 月前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

5 月前

user3472810 · Angular@Output/EventEmitter返回undefined

5 月前

lokiuucx · JS对象属性返回未定义,尽管对象属性应该有值

5 月前