Question

使用Highcharts 4.1.1。如果选择了一个点，我会显示一个包含更多信息的div。如果所有点都未被选中，我想隐藏div。我想我可以使用click事件。如果我将event记录到控制台，我可以检查它并看到point.state的值是＆＃34;选择＆＃34;而point.selected是真的。但是，如果我尝试记录event.point.state（而不仅仅是event），结果就是＆＃34; hover＆＃34;。因此，我无法使用event.point.selected值，因为它有时未定义。

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'scatter'
        },
        plotOptions: {
            series: {
                allowPointSelect: true,
                marker: {
                    states: {
                        select: {
                            enabled: true
                        }
                    }
                },
                point: {
                    events: {
                        click: function () {
                            $("#pointState").html("State: " + event.point.state + "<br>" + "Selected? " + event.point.selected);
                        }
                    }
                }
            }
        },
        series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
        }]
    });
});

小提琴：http://jsfiddle.net/1gsqq8yr/1/

点击任意一点，注意状态是＆＃34;悬停＆＃34;。为什么？再次点击同一个点，状态为＆＃34;选择＆＃34;但是selected值是＆＃34; true＆＃34; （不应该是假的吗？）。我已经尝试将悬停状态enabled设置为false，但之后返回undefined。我真的不知道这里发生了什么。

Answer 1

正在发生的事情是之前图表会更改该点的选定状态，它会运行您的代码，因此它会为您带来之前选择的状态

这就是为什么所选属性每次都相反，这就是返回false取消操作的原因，因为它尚未被触发。我不知道API中的任何变通方法，但您可以检查状态并根据自己的喜好返回对立面：

var state = (this.state == "hover")? "selected" : "hover";
var selected = (this.selected == true) ? "false" : "true";
$("#pointState").html("State: " + state + "<br>" + "Selected? " + selected);

这里是fiddle。

Highcharts点击事件返回＆＃34; hover＆＃34;国家而不是＆＃34;选择＆＃34;州

1 个答案: