Question

Highcharts.chart('container', {

  chart: {
  polar: true,
  type: 'line'
},

title: {
  text: 'Highcharts Polar Chart'
 },

 pane: {
   //size:'80%'
 },

  xAxis: {
   categories: ['passes_ratio', 'pass_verticality', 'shots', 'goals'],
  },

 yAxis: [{
   min: 0,
   max: 1,
   angle: 45
 }, {
   min: 0,
   max: 100,
   angle: 135
 }, {
  min: 0,
  max: 10,
  angle: 225
 }, {
  min: 0,
  max: 1,
  angle: 315
 }] ,

 series: [{
   data: [.8, .7, .6, .5],
   yAxis: 0
 }

我已经用Highcharts库制作了一个图表，我想更改鼠标悬停在某个点上时出现的值。

例如，在目标轴中，原始值为 0.5 ，但我希望显示 5.7 而不改变实际价值。其余变量相同。

有没有办法做到这一点？这是示例：

http://jsfiddle.net/atelei/aobf0zyr/

Answer 1

您可以使用formatter属性中的tooltip，如下所示：

tooltip: {
    formatter: function () {
        return 'The value for <b>' + this.x +
            '</b> is <b>' + (this.y + 0.7) + '</b>';
    }
},

这是代码段示例：

Highcharts.chart('container', {

  chart: {
    polar: true,
    type: 'line'
  },

  title: {
    text: 'Highcharts Polar Chart'
  },

  pane: {
    //size:'80%'
  },

  xAxis: {
    categories: ['passes_ratio', 'pass_verticality', 'shots', 'goals'],
  },

    tooltip: {
        formatter: function () {
            return 'The value for <b>' + this.x +
                '</b> is <b>' + (this.y + 0.7) + '</b>';
        }
    },
  yAxis: [{
    min: 0,
    max: 1,
    angle: 45
  }, {
    min: 0,
    max: 100,
    angle: 135
  }, {
    min: 0,
    max: 5,
    angle: 225
  }, {
    min: 0,
    max: 10,
    angle: 315
  }],

  series: [{
    data: [.8, .7, .6, .5],
    yAxis: 0
  }/*,{
    data: [11, 22, 33, 44],
    yAxis: 1
  }, {

    data: [1, 2, 3, 4],
    yAxis: 2
  }, {

    data: [2, 4, 6, .8],
    yAxis: 3
  }*/]
});

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="min-width: 310px; max-width: 800px; height: 800px; margin: 0 auto"></div>

Highcharts Polar，编辑鼠标悬停标签

1 个答案: