Question

我使用下面的代码设置了酒吧悬停颜色：

plotOptions: {column: {states: {hover: {color: '#000000'}}}}

但是如何动态更改条形悬停颜色？

Answer 1

定义的颜色集，当您每次从给定集体中体验到不同颜色的悬停效果时加载图表

var colors= ['#7cb5ec', '#434348', '#90ed7d', '#f7a35c', '#8085e9', 
   '#f15c80', '#e4d354', '#2b908f', '#f45b5b', '#91e8e1'];


    var x = Math.floor((Math.random() * 10) );

            plotOptions: {
                column: {
                    states: {
                        hover: {
                            color: colors[x]                                                           
                        }
                    }

                }
            },

fiddle link了解详情

为了将来继续工作，请按一下按钮以触发图表重新加载

Answer 2

在从您想要获得颜色的下拉菜单中创建一个图表。像<select id="idd" onChange="getColor()"> <option value="red">R</option> <option value="green">G</option> </select>之类的东西我做了一点here。将很快改善它。

Answer 3

只需使用point.update(options)，您可以在选项中设置新的悬停颜色：

    chart.series[0].data[0].update({
        states: {
            hover: {
                color: "red"
            }    
        }
    });

演示：http://jsfiddle.net/xoje27rt/

如何动态更改高亮度图的条形悬停颜色？

3 个答案: