反向highcharts热图传奇

Question

这是一个Highfrts热图的JSFiddle演示.请注意,右侧图例中的数字从下到上增加.默认情况下,它们从上到下增加,但我改变了它

colorAxis: {
    reversed: false
}

但是,我现在遇到的问题是图例上的颜色与热图本身的颜色不匹配.例如,图例表示红色是最低值,但热图使用红色表示最高值.

演示中最相关的代码是:

colorAxis: {
    reversed: false,
    min: 0,
    stops: [
        [0, '#00FF00'],
        [0.5, '#FF8000'],
        [1, '#FF0040']
    ]
},

legend: {
    align: 'right',
    layout: 'vertical',
    margin: 0,
    verticalAlign: 'top',
    y: 25,
    symbolHeight: 320,

    // I tried setting this to true and false but neither fix my problem
    // reversed: true
},

Answer 1

你需要修改所谓的colorAxis.它具有此处列出的默认属性以进行反转.因此,对于您提供的示例链接,您需要设置:

colorAxis: {
    reversed: false,
    min: 0,
    minColor: '#FFFFFF',
    maxColor: Highcharts.getOptions().colors[0]
},

它与legenda colorAxis仅处理项目的位置/对齐的属性不同colorAxis.要修改colorAxis您必须编辑colorAxis属性的内容.