如何在HighChart非自动换行的极坐标图中制作x轴类别标签？

Question

这是源代码：

https://jsfiddle.net/24zrbqpL/

Highcharts.chart('container', {
  "chart": {
    "type": "line",
    "polar": true
  },
  "xAxis": {
    "min": 0.5,
    "max": 6.5,
    "categories": ['Clarify Objectives', 'Propose Initiates', 'Prioritise & Select', 'Track Performance', 'Review Portfolio', 'Adjust Course', ''],
    "labels": {
            "distance": 25
    },
    "tickmarkPlacement": "on",
    "lineWidth": 0,
    "gridLineColor": "#575756",
    "title": {
      "style": {
        "fontFamily": "\"Lucida Grande\", \"Lucida Sans Unicode\", Verdana, Arial, Helvetica, sans-serif",
        "color": "#666666",
        "fontSize": "30px",
        "fontWeight": "normal",
        "fontStyle": "normal"
      }
    }
  },
  "yAxis": {
    "plotBands": [{
      "from": 1,
      "to": 2,
      "color": "#f8c4c0",
      "outerRadius": "105%",
      "thickness": "50%"
    }, {
      "from": 2,
      "to": 3,
      "color": "#f39d96",
      "outerRadius": "105%",
      "thickness": "50%"
    }, {
      "from": 3,
      "to": 4,
      "color": "#ee766d",
      "outerRadius": "105%",
      "thickness": "50%"
    }, {
      "from": 4,
      "to": 5,
      "color": "#eb584d",
      "outerRadius": "105%",
      "thickness": "50%"
    }],
    "reversed": true,
    "min": 1,
    "max": 5,
    "allowDecimals": false,
    "tickInterval": 1,
    "tickAmount": 6,
    "tickLength": 10,
    "gridLineInterpolation": "polygon",
    "gridLineColor": "",
    "lineWidth": 0,
    "tickmarkPlacement": "between",
    "tickPixelInterval": 100,
    "tickPosition": "outside",
    "labels": {
      "enabled": true,
      "style": {
        "fontWeight": "bold"
      },
      //"y": 25
    }
  },
  "title": {
    "text": "APM Spiderweb"
  },
  "series": [{
    data: [1, 2, 3, 4, 5, 6]
  }, {

  }],
  "plotOptions": {
    "series": {
      "animation": true,
      "lineWidth": 4,
      "marker": {
        "radius": 8,
        "symbol": "circle"
      },
      "_colorIndex": 0,
      "_symbolIndex": 0
    }
  },
  "credits": {
    "enabled": false
  },
  "colors": [
    "#7cb5ec",
    "#90ed7d",
    "#f7a35c",
    "#8085e9",
    "#f15c80",
    "#e4d354",
    "#2b908f",
    "#f45b5b",
    "#91e8e1"
  ]
});

Answer 1

在labels.style对象中将 whiteSpace 设置为“ nowrap”是您正在寻找的解决方案。

"labels": {
  "distance": 25,
  "style": {
    "whiteSpace": 'nowrap'
  }
},

演示：https://jsfiddle.net/BlackLabel/edpcjL3k/

API：https://api.highcharts.com/highcharts/xAxis.labels.style