在xAxis上以高图显示图像

Question

我在xAxis中总共有10个类别,我想在xAxis中显示类别图标,因此请告诉我如何在高图中的xAxis中显示图标.

Answer 1

一种选择是formatter与标签结合使用useHTML: true.

例如:

xAxis: {
    categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
        'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
    labels: {
        useHTML: true,
        formatter: function() {
            if(this.value == "Jun")
                return '<img src="http://www.highcharts.com/demo/gfx/sun.png" style="width: 30px; vertical-align: middle" />'+this.value;
            else if(this.value == "Dec")
                 return '<img src="http://www.highcharts.com/demo/gfx/snow.png" style="width: 30px; vertical-align: middle" />'+this.value;
            else
                return this.value;
        }
    }
}

看到这个JSFiddle演示.