如何在高图表中旋转第一个和最后一个 x 轴标签

Question

我只想在 x 轴上旋转第一个和最后一个标签。我有以下格式化程序功能：

formatter() {
    if (this.isFirst || this.isLast) {
        // First or last label here
        var rotatedValue = this.value.doRotation();   // TODO here
        return rotatedValue;
    } else {
        return this.axis.defaultLabelFormatter.call(this);
    }
},

我做了一个研究，但什么也没找到（如何调用一些旋转函数）。我使用基本的折线图。

Answer 1

您可以设置xAxis.labels.useHTML选项以通过 CSS3 true和设置这些标签的样式：

  xAxis: {
    labels: {
      useHTML: true
    }
  },
  chart: {
    events: {
      load: function() {
        var div = this.xAxis[0].labelGroup.div;
        div.firstChild.style.transform = "rotate(30deg)";
        div.lastChild.style.transform = "rotate(30deg)";
      }
    }
  }

现场工作演示：http://jsfiddle.net/kkulig/fepj1f5g/

API 参考：http://api.highcharts.com/highcharts/xAxis.labels.useHTML