highchart 3d专栏 - 显示“beta轴标题”和“beta轴标签”

时间:2017-10-30 09:50:18

标签: javascript highcharts

英语不是我的母语。如果您不理解我的问题,请告诉我。

我想在高图中显示“beta轴标题”和“beta轴标签”。我想要的是如下:

I want

然而,我得到的是:

I got

我用Google搜索。我找不到解决问题的方法。

我的javascript代码如下。

$(function () {
$('#container').highcharts({
    chart: {
        type: 'column',
        margin: 75,
        options3d: {
            enabled: true,
            alpha: 15,
            beta: 50,
            depth: 110
        }
    },
    title: {
        text: null
    },
    xAxis:{
    title: {
          text: "构建日期"
      },
        categories: ["2010-10-17","2010-10-18","2010-10-19","2010-10-20","2010-10-21","2010-10-22"],

    },
    yAxis: {
      title: {
          text: "内存(MB)"
      }
         },
    plotOptions: {
        column: {
            depth: 40,
            stacking: true,
            grouping: false,
            groupZPadding: 10
        }
    },
    series: [{
            name: 'HUAWEI',
        data: [1, 2, 4, 3, 2, 4],
        stack: 0
    }, {
            name: 'XIAOMI',
        data: [5, 6, 3, 4, 1, 2],
        stack: 1
    }, {
            name: 'oppo',
        data: [7, 9, 8, 7, 5, 8],
        stack: 2
    }]
  });
});

1 个答案:

答案 0 :(得分:0)

您需要将zAxis类别设置为labelszAxis title设置标题。重要的是要注意,要显示标签,您需要来定义最小和最大。这是一个最小的例子,可以显示所有内容(在彼此之上):

zAxis: {
  title: {
    text: 'TITLE HERE',
    },
  min: 0,
  max: 2,
  categories: ["HUAWEI", "XIAOMI", "oppo"] 
}

Ex1

工作示例: http://jsfiddle.net/ewolden/0uc1g8b5/3/

有很多选项可以调整外观,你应该看一下zAxis labels / titles上的API。

zAxis.titles上的

API: https://api.highcharts.com/highcharts/zAxis.title

例如,您可以旋转并让它看起来像这样:

ex2

工作示例: http://jsfiddle.net/ewolden/0uc1g8b5/5/

或者你可以使用skew3d,看起来像这样:

ex3

工作示例: http://jsfiddle.net/ewolden/0uc1g8b5/6/

这很大程度上取决于你想要写的标题和标签。你只需要进行实验。