【问题标题】:highcharts: change color of pie slice on hoverhighcharts:悬停时更改饼图的颜色
【发布时间】:2013-08-27 19:43:13
【问题描述】:

当一个饼图的切片悬停在上面时,我希望它变为指定的悬停颜色,然后在鼠标离开该切片时变回原来的颜色。

这里的文档 (http://api.highcharts.com/highcharts#plotOptions.series.marker.states.hover) 使它看起来像下面的工作,但我没有任何运气:

http://jsfiddle.net/pixeloco/ztJkb/3/

plotOptions: {
   series: {
      marker: {
        states: {
          hover: {
            fillColor: 'black'
          }
        }
      }
   }
},

我找到了这个解决方案http://jsfiddle.net/r6p7E/6/,但它要求所有切片颜色相同。有没有办法制作一个带有在悬停时改变颜色的切片的多色图表?

【问题讨论】:

    标签: colors highcharts hover


    【解决方案1】:

    看来您需要这些选项:

        series: {
            states: {
                hover: {
                    enabled: false
                }
            },
            point: {
                events: {
                    mouseOver: function () {
                        this.options.oldColor = this.color;
                        this.graphic.attr("fill", "black");
                    },
                    mouseOut: function () {
                        this.graphic.attr("fill", this.options.oldColor);
                    }
                }
            },
        }
    

    FIDDLE EXAMPLE

    【讨论】:

    • 完美!这回答了我最初的问题,但是......知道为什么同样的方法不适用于条形图吗? jsfiddle.net/pixeloco/RPbjY 该部分在悬停时会发生变化,但如果悬停不止一次,它不会恢复到原始颜色
    • this.options.oldColor = this.color;改成this.options.oldColor = this.graphic.fill;jsfiddle.net/RPbjY/2