6

我用 highcharts http://www.highcharts.com/demo/polar-spider创建了一个极地蜘蛛图,我想知道是否可以为每个类别设置比例(最小值和最大值)。

4

1 回答 1

1

正如 Halvor Strand 在他的评论中指出的那样,解决这个问题的一种可能方法是让每个图表点与图表中心的距离不同。

我选择创建一个“虚拟”线系列作为“不平衡”图表点,同时使线后面的真实网格不可见。

这是“虚拟”系列的代码:

    {
      name: 'dummy series for category max/mins',
      dataLabels: {
        allowOverlap: true,
        enabled: true,
        formatter:function() {
          return this.point.name;
        },
        style:{color:"black"}
      },
      data: [
        { y: 90000, name: 'Sales', dataLabels: { align: 'center', y: -5 } }, 
        { y: 70000, name: 'Marketing', dataLabels: { align: 'left', x: 10, y: 15 } },
        { y: 85000, name: 'Development', dataLabels: { align: 'left', x: 10, y: 15 } },
        { y: 80000, name: 'Customer Support', dataLabels: { align: 'center', y: 30 } },
        { y: 95000, name: 'Information<br />Technology', dataLabels: { align: 'right', x: -10, y: 15 } },
        { y: 100000, name: 'Administration', dataLabels: { align: 'right', x: -10, y: 15 } }
      ],
      pointPlacement: 'on',
      showInLegend: false,
      enableMouseTracking: false,
      lineWidth: 2,
      lineColor: 'red',
      marker: { enabled: false }
    }

我在这里所做的是手动设置每个图表点的“最大值”,并为它们命名以匹配通常在 x 轴类别中显示的内容。

所有系列的dataLabels属性都返回每个数据点的name属性。然后,对于每个数据点,都有唯一的dataLabels属性来定位标签。

为了隐藏 x 轴和 y 轴的网格线和标签,我分别添加了gridLineWidth: 0labels: { enabled: false }

结果显示如下:

在此处输入图像描述

可以在http://jsfiddle.net/brightmatrix/bjrm0cr3/找到这个例子的工作小提琴。

于 2016-06-23T00:58:14.463 回答