如何禁用Highcharts中的悬停颜色变化?

时间:2014-01-24 13:41:40

标签: colors highcharts hover

我正在使用我的项目的柱形图。我编写了一个自定义函数,根据y值为图表的每个条形图着色。这在我初始化图表时工作正常。当我将鼠标悬停在图表上时,条形图的颜色会恢复为默认颜色,我的自定义颜色永远不会返回。

我尝试在悬停时禁用,但这似乎不起作用。即使在酒吧上空盘旋,我也不希望颜色发生变化。有什么建议吗?

2 个答案:

答案 0 :(得分:13)

您正在寻找this option

   plotOptions: {
        series: {
            states: {
                hover: {
                    enabled: false
                }
            }
        }
    },

小提琴here

<强> EDITS

不是直接修改SVG来设置颜色,而是在api中执行:

    var max = 200;
    var seriesData = $.map([107, 31, 635, 203, 2],function(datum, i){
        return {
            color: datum > max ? 'red' : '#2f7ed8',
            y: datum
        };
    });


  $('#container').highcharts({
        chart: {
            type: 'bar'
        },
        tooltip: {
            valueSuffix: ' millions'
        },
        series: [{
            name: 'Year 1800',
            data: seriesData
        }]
    });

fiddle

答案 1 :(得分:5)

您正在以错误的方式更新颜色,而是使用point.update()http://jsfiddle.net/CaPG9/8/

    $('#container').highcharts({
        chart: {
            type: 'bar'
        },
        tooltip: {
            valueSuffix: ' millions'
        },
        series: [{
            name: 'Year 1800',
            data: [107, 31, 635, 203, 2]
        }]
    },function(chart){

        var max = 200;

        $.each(chart.series[0].data,function(i,data){

            if(data.y > max)
                data.update({
                    color:'red'
                });

        });

    });