高图颜色不显示

debugcn 发表于 Dev

汤姆·哈蒙德

我才刚开始玩海图。我发现在设置color属性时，它实际上并没有设置特定的十六进制颜色-而是当您将鼠标悬停在图表上并突出显示时，它仅显示该十六进制颜色。Highcharts似乎在“自动变暗”颜色，因此，当您将鼠标悬停在它上面时，它会突出显示并显示您在创建图表时列出的特定十六进制颜色。

有没有办法设置显示的实际颜色？最好能够指定最初应显示哪种十六进制颜色以及突出显示时将显示哪种十六进制颜色，而不是自动将颜色变暗并突出显示为指定的十六进制颜色：

$('#ageChart').highcharts({
        chart: {
          marginRight: 50,
          marginTop: 0,
          plotBackgroundColor: null,
          plotBorderWidth: null,
          plotShadow: false
        },
        title: {
          text: '',
          style: {
            fontSize: 10
          }
        },
        tooltip: {
          pointFormat: '<b>{point.percentage:.1f}%</b>'
        },
        credits: {
          enabled: false
        },
        exporting: {
          enabled: false
        },
        plotOptions: {
          pie: {
            size: 300,
            allowPointSelect: true,
            cursor: 'pointer',
            dataLabels: {
              enabled: false
            },
            showInLegend: true
          }
        },
        series: [{
          type: 'pie',
          name: 'Age Breakdown',
          data: [
            {
              name: "14-17",
              y: fourteenToSeventeen,
              color: "#E0DBBA"
            },
            {
              name: "18-24",
              y: eighteenToTwentyFour,
              color: "#8C8C8B"
            },
            {
              name: "25-34",
              y: twentyFiveToThirtyFour,
              color: "#BEE7E8"
            },
            {
              name: "35-44",
              y: thirtyFiveToFourtyFour,
              color: "#217C7E"
            },
            {
              name: "45-54",
              y: fourtyFiveToFiftyFour,
              color: "#687D68"
            },
            {
              name: "55+",
              y: fiftyFivePlus,
              color: "#634357"
            }
          ]
        }]
      })

阿米特

颜色实际上是正确显示的。但是在悬停状态下，Highcharts将颜色变亮。

可以通过将亮度因子指定为0来关闭此行为，如下所示：

$('#container').highcharts({
        ..
        ..

        series: [{
          type: 'pie',
          name: 'Age Breakdown',

            //add this section
            states: {
                hover: {
                    brightness: 0   
                }
            },

            data: [
            ..
            ..
            ]
        }]

   })

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。