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选项设置为true，并通过 CSS3 设置这些标签的样式：

  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

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

1 个答案: