高图中所选列的不同边框

时间:2013-02-26 09:26:38

标签: javascript highcharts

我在我的应用程序中使用了highchart的柱形图。

我有柱形图。当用户选择图表中的列时,所选列应显示不同的边框颜色和不同的宽度。

以下是代码段

$(function () {
    var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'column'
        },
        xAxis: {
            categories: [
                'Jan', 'Feb', 'Mar', 
                'Apr', 'May', 'Jun', 
                'Jul', 'Aug', 'Sep', 
                'Oct', 'Nov', 'Dec'
            ]
        },
        plotOptions: {
            series: {
                allowPointSelect: true,
                marker: {
                    states: {
                        select: { lineWidth: 10 }
                    }
                }
            }
        },
        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
            ]        
        }]
    });
});

Code snippet

当我选择列时,颜色变为灰色。我希望他们保持一致。

1 个答案:

答案 0 :(得分:8)

你的意思是这样的:

plotOptions: {
        series: {
            allowPointSelect: true,
            states: {
                select: {
                    color: null,
                    borderWidth:5,
                    borderColor:'Blue'
                }
            }
        }
    },

DEMO