Highcharts 变量饼图

Question

有什么方法可以在变量 pie 中设置相对于饼图半径的 z 值？

因为如果我将一个饼图的 z 值设置为 100，另一个饼图设置为 10，那么第二个饼图不会与第一个饼图成比例绘制，并且呈现得比代表 10 和100个差距。

Highcharts.chart('container', {
  chart: {
    type: 'variablepie',
  },
  series: [{
    data: [{
      y: 505370,
      z: 10
    }, {
      y: 551500,
      z: 50
    }, {
      y: 312685,
      z: 100
    }]
  }]
});

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/variable-pie.js"></script>

<div id="container"></div>

这里的z值是10、50和100，但是在图中每个圆弧的半径并不按比例表示。

或者是否有任何其他属性可以设置成比例？

Answer 1

您可以使用 sizeBy option. More details:

This option is related to how the Z value is represented in a pie slice. The pie slice's value can be represented by the area or the radius of the slice. The default, area, corresponds best to the human perception of the size of each pie slice.

它的默认值是面积所以你需要把它改成半径:

Highcharts.chart('container', {
  chart: {
    type: 'variablepie',
  },
  series: [{
    sizeBy: 'radius',
    data: [{
      y: 505370,
      z: 10
    }, {
      y: 551500,
      z: 50
    }, {
      y: 312685,
      z: 100
    }]
  }]
});

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/variable-pie.js"></script>

<div id="container"></div>

Highcharts 变量饼图

Highcharts Variable Pie

javascript

jquery

highcharts