Question

我在Highcharts工作并在图表上绘制形状（圆圈）。我想让圈子可点击但是有一些问题。我尝试添加onclick事件，但在我看来，圆圈是在图表的背景上绘制的，并且没有收到点击事件。这是我的小提琴代码的链接。

$(function() {
var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        zoomType: 'x'
    },
     title: {
        text: 'Fruit Count'
    },
    xAxis: {
        type: 'datetime'
    },
    yAxis: {
        title: {
            text: 'Fruits'
        }
    },
    series: [{
        name: 'John',
        data: [[Date.UTC(2014,5,25),5], [Date.UTC(2014,6,22),7], [Date.UTC(2014,7,9),3]]
    }]
});

addCircle(chart);

function click_chart(evt) {
    alert('byby');
}


function addCircle(crt) { // on complete
    var circleradius = 10;

    var xaxis=chart.xAxis[0];
    var yaxis =chart.yAxis[0];
    var xpos=xaxis.toPixels(Date.UTC(2014,5,25));
    var ypos=yaxis.toPixels(2);

// Render the circle
chart.renderer.circle(xpos, ypos, circleradius).attr({
    onclick: function(evt){
        alert('yo');
    },
    fill: 'red'

}).add();
}
});

有关如何让圈子听到点击事件的任何帮助都会很棒！谢谢！

Answer 1

尝试使用on-function代替将听众添加到您的圈子中。

例如（JSFiddle demonstration）：

// Render the circle
chart.renderer.circle(xpos, ypos, circleradius)
.on('click', function() {
    alert('yo');
}).css({
    fill: 'red'
}).add();

使图形在highcharts中可点击

1 个答案: