JavaScript如何将YYYY-MM格式转为英文月份-短年格式供Highcharts使用

DevOps 小满

2026-8-28

实现方案

直接拆分字符串处理是兼容性最好的方案，可避免Date对象解析YYYY-MM格式时的时区偏移问题，处理完成的结果可以直接传入Highcharts的categories配置项使用。

核心步骤

预定义英文月份全称数组，数组索引对应「月份数字-1」（月份值从1开始，数组索引从0开始）
遍历原始数据集，拆分每个monthDate字段的年份、月份部分
按要求拼接为「英文月份全称-两位年份」格式，最终生成分类数组
将分类数组传入Highcharts配置，同时可直接提取原数据集的count字段作为图表系列数据

完整实现代码

// 原始数据集
var dataset = [
  {"monthDate": "2018-05", "count": 83},
  {"monthDate": "2018-06", "count": 23}
  // 其余同格式数据...
];

// 英文月份全称映射表
const monthNameMap = [
  "January", "February", "March", "April", "May", "June",
  "July", "August", "September", "October", "November", "December"
];

// 生成Highcharts所需的分类数组
const chartCategories = dataset.map(function(item) {
  const dateParts = item.monthDate.split('-');
  const yearStr = dateParts[0];
  const monthNum = parseInt(dateParts[1], 10);
  // 拼接目标格式
  return monthNameMap[monthNum - 1] + '-' + yearStr.slice(-2);
});

// Highcharts初始化配置
Highcharts.chart('chartContainer', {
  xAxis: {
    categories: chartCategories // 传入处理好的分类
  },
  series: [{
    name: '统计值',
    data: dataset.map(function(item) {
      return item.count;
    })
  }]
  // 其余图表配置项按需求添加即可
});