首页 文章

Highcharts：是否可以绘制没有数据值的旭日形图？

提问于
浏览 次
0

我想绘制对称的多级饼图 . 请参阅组织层次结构示例：Here

我试过以下http://jsfiddle.net/amrutaJgtp/7r8eb5ms/7/

series: [{
type: "sunburst",
data: [{
  id: '0.0'
}, {
  id: '1.0',
  parent: '0.0',
  name: 'Consumer',
  color: colors[1]
}, {
  parent: '1.0',
  name: 'Furniture',
  value: 1
}, {
  parent: '1.0',
  name: 'Office Supplies',
  value: 1
}, {
  parent: '1.0',
  name: 'Technology',
  value: 1
}, {
  id: '2.0',
  name: 'Corporate',
  parent: '0.0',
  color: colors[2]
}, {
  parent: '2.0',
  name: 'Furniture',
  value: 1
}, {
  parent: '2.0',
  name: 'Office Supplies',
  value: 1
}, {
  parent: '2.0',
  name: 'Technology',
  value: 1
}, {
  id: '3.0',
  name: 'Home office',
  parent: '0.0',
  color: colors[3]
}, {
  parent: '3.0',
  name: 'Furniture',
  value: 1
}, {
  parent: '3.0',
  name: 'Office Supplies',
  value: 1
}, {
  parent: '3.0',
  name: 'Technology',
  value: 1
}, {
  id: '4.0',
  name: 'Small Business',
  parent: '0.0',
  color: colors[4]
}, {
  parent: '4.0',
  name: 'Office Supplies'
}, {
  parent: '4.0',
  name: 'Technology'
}],

没有看到“小企业”类别 .

如果我没有定义任何数据值，则不会绘制旭日形图 . 我希望所有类别的大小都是对称的 .

有没有办法使用Highcharts森伯斯特图来实现对称的多级饼图？

javascript charts highcharts

1 回答

  • 2

    根据需要，有多种选择 . 这里有四个可能的选项，以及它们相应的小提琴：

    Fiddle 1 ：
    http://jsfiddle.net/7r8eb5ms/9/

    Fiddle 2 ：
    http://jsfiddle.net/65ysr826/

    Fiddle 3 ：
    http://jsfiddle.net/fpysybhe/

    Fiddle 4 ：
    http://jsfiddle.net/nab8xu33/

    其中3个每点都有一个附加参数：

    tooltipIncluded: false

    使用此格式化程序控制工具提示：

    tooltip: {
  formatter: function() {
    if (this.point.tooltipIncluded) {
      return 'The population of <b>' + this.point.name + '</b> is <b>' + this.point.value + '</b>';
    } else {
      return false;
    }
  }
}
    回复于

相关问题