Question

我对Highcharts: set 'select' state on a point and maintain it after mouseover?

有类似但不同的问题

这与在redraw事件之后呈现点而不是mouseover事件有关。

我在散点图中设置了一个特定点，以便选择＆＃39;状态：

var chart = new Highcharts.Chart(options);
chart.get('b').setState('select');

我还在图表选项中定义了select状态如下：

 select: {
   radius: 8,
   enabled: true,
   lineColor: 'red',
   fillColor: 'red'
}

该点为红色，半径为8，您可以在此JSFiddle中看到：http://jsfiddle.net/o72xgtfm/3/

但是，当我在图表上运行redraw时，颜色保持不变（因此select状态仍明确保持在该点上，即this question is not a duplicate of my other question about select state）但半径减小

为什么呢？如何在这一点上将半径设置为8？

Answer 1

这是因为point.setState（'select'）与point.select（true）不同。

正如您所指出的，point.select（）是API的一部分，它正在运行 - http://jsfiddle.net/o72xgtfm/5/

事实上，point.select（）代码的一部分是point.setState（'select'），但它也将point的属性 - 'selected'设置为true，并将point.options.selected设置为true。

select: function (selected, accumulate) {
        var point = this,
            series = point.series,
            chart = series.chart;

        selected = pick(selected, !point.selected);

        // fire the event with the defalut handler
        point.firePointEvent(selected ? 'select' : 'unselect', { accumulate: accumulate }, function () {
            point.selected = point.options.selected = selected;
            series.options.data[inArray(point, series.data)] = point.options;

            point.setState(selected && SELECT_STATE);

            // unselect all other points unless Ctrl or Cmd + click
            if (!accumulate) {
                each(chart.getSelectedPoints(), function (loopPoint) {
                    if (loopPoint.selected && loopPoint !== point) {
                        loopPoint.selected = loopPoint.options.selected = false;
                        series.options.data[inArray(loopPoint, series.data)] = loopPoint.options;
                        loopPoint.setState(NORMAL_STATE);
                            loopPoint.firePointEvent('unselect');
                    }
                });
            }
        });
    },

知道这一点可以调用具有相同效果的point.setState（'select'） - http://jsfiddle.net/o72xgtfm/6/

chart.get('b').setState('select');
chart.get('b').selected = true;
chart.get('b').options.selected = true;

Answer 2

我最终通过使用：

设法解决了这个问题

point.select(true, true);

而不是

point.setState('select');

后者没有证件，而第一种似乎是官方的做事方式。

Highcharts：为什么重绘会改变所选点的半径？

2 个答案: