Question

拥有带自定义标记/图标的'散点图'：

series: [{
     marker: {
         symbol: 'url(http://www.highcharts.com/demo/gfx/sun.png)'
    }
}]

http://jsfiddle.net/sy6nb7fk

取消选择数据系列时，有没有办法替换图例图标？

即。使用'sun_disabled.png'

Answer 1

您必须进行update调用才能更改某些事件的标记。

如果仅使用图例项目显示/隐藏系列，则可以在plotOptions.series.events.legendItemClick中执行此操作。例如（JSFiddle）：

plotOptions: {
    series: {
        events: {
            legendItemClick: function(event) {
                var imageName = (this.visible ? 'snow' : 'sun');

                this.update({ 
                    marker: { 
                        symbol: 'url(http://www.highcharts.com/demo/gfx/'+ imageName +'.png)' 
                    } 
                });
            }
        }
    }
}

如果使用hide()和show()函数调用显示/隐藏系列，您可以使用Series.events.hide和Series.events.show执行相同操作。例如（JSFiddle）：

series: [{
    events: {
        hide: function() {
            this.update({ 
                marker: { 
                    symbol: 'url(http://www.highcharts.com/demo/gfx/snow.png)' 
                } 
            });
        },
        show: function() {
           this.update({ 
                marker: { 
                    symbol: 'url(http://www.highcharts.com/demo/gfx/sun.png)' 
                } 
            });
        }
    },
    marker: {
        symbol: 'url(http://www.highcharts.com/demo/gfx/sun.png)'
    },
    data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
}]

Highcharts：更改图例符号运行时

1 个答案: