javascript - highchart 3d列-显示“beta轴标题”和“beta轴标签”

英语不是我的母语。如果您不明白我的问题，请告诉我。

我想在highchart中显示“ beta轴标题”和“ beta轴标签”。我想要的如下：



但是，我得到的是这里：



我用谷歌搜索。我没有找到解决问题的办法。

我的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
    }]
  });
});

最佳答案

您需要将zAxis类别设置为具有labels，并且将zAxis title设置为标题。重要的是要注意，要显示标签，您需要定义最小值和最大值。这是一个最小的示例，它将显示所有内容（在彼此之上）：

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

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

有很多选项可以调整外观，您应该查看zAxis labels / titles上的API。

zAxis.titles上的API：https://api.highcharts.com/highcharts/zAxis.title

例如，您可以旋转并使它看起来像这样：



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

或者，您可以使用skew3d并使其如下所示：



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

这很大程度上取决于您要写的标题和标签。您将只需要试验。

关于javascript - highchart 3d列-显示“beta轴标题”和“beta轴标签”，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/47012232/