2026年Highcharts迎来系列更新｜ V12.5 正式发布

更新日志见官网：https://www.highcharts.com/changelog/

2026年1月12日 --- Highcharts团队正式发布v12.5.0版本，为核心产品线带来多项重要更新。

本次发布最值得关注的亮点包括树状图（Dendrogram）的正式支持 、Highcharts Grid 2.2.0的重大升级，以及多项开发者体验优化。

1. 重大突破：树状图可沿X轴绘制

本次最重要的一项更新：树图进化为树状统计图（Dendrogram）

功能概述

过去，Highcharts的treegraph图表只能沿Y轴分层展示。v12.5.0版本解除了这一限制，现在treegraph图表可以沿X轴绘制 ，从而支持了真正的树状图（Dendrogram） 可视化。

技术价值

这一更新使得Highcharts能够：

• 展示层次聚类分析结果：适用于生物信息学、数据挖掘中的聚类可视化

• 呈现组织结构演化：清晰展示公司、学科或分类系统的层次结构

• 支持横向比较：当横向空间更充足时，提供更优的可读性布局

这次改动看似只是"支持 x 轴"，本质上它是 "树 + 数值维度" 的结合，实际上：

Highcharts 正式跨入 统计分析型结构数据可视化 的领域。

这一步，过去更多是科学绘图库（如 D3、Python 生态）的专属地盘。

应用场景

Highcharts.chart('container', {

    chart: {

        type: 'treegraph',

        inverted: false // Set to false to draw along the X-axis

    },

    title: {

        text: 'Sample Treegraph'

    },

    series: [{

        data: [

            { id: 'A', parent: '' },

            { id: 'B', parent: 'A' },

            { id: 'C', parent: 'A' },

            { id: 'D', parent: 'B' },

            { id: 'E', parent: 'B' },

            { id: 'F', parent: 'C' },

            { id: 'G', parent: 'C' }

        ]

    }]

});

2. 核心配置与主题优化

样式系统持续收敛：Highcharts 正在向"设计系统友好"靠拢

1. 新增图例宽度限制

新增 legend.maxWidth 选项，允许开发者精确控制图例容器的最大宽度，解决长标签导致布局溢出的问题。

新增 legend.maxWidth 选项：不是小功能，是工程救命绳，legend.maxWidth 这个选项，解决的是一个非常真实的问题：

• 图例过长

• 多语言环境

• 响应式布局

• 企业系统中"图表嵌在复杂 UI 里"

这不是 Demo 层面的烦恼，而是真实生产环境里反复踩坑的问题。

Highcharts 一直在做的事很明确：

把"你不得不自己 hack 的事"，慢慢变成官方选项。

javascript

legend:{maxWidth:300,// 新增：限制图例最大宽度layout:'horizontal'}

2. 增强CSS主题兼容性

全系列CSS文件和Adaptive主题现已支持 color-scheme CSS属性 ，可与 light-dark() CSS函数无缝配合，实现更智能的明暗主题切换。

CSS color-scheme 全面引入：为深色模式补最后一刀。Highcharts 在 CSS 层面引入 color-scheme，并支持 light-dark()：

• 自动适配深色 / 浅色模式

• 与操作系统、浏览器主题一致

• 与企业 Design System 协同

这一步非常关键。

它标志着 Highcharts 的样式体系，正在从「主题切换」升级为：

"原生融入现代 CSS 生态"

这对长期维护型项目是巨大红利。

css

/* 现在可以这样定义主题颜色 */:root{color-scheme: light dark;--primary-color:light-dark(#1a5fb4, #62a0ea);}

3. 开发者友好提示

当启用 chart.styledMode 但未加载必要CSS文件时，控制台将显示清晰的警告信息，帮助开发者快速定位样式问题。

Styled Mode 警告机制：这是在替工程师兜底。当启用 chart.styledMode 却忘了加载 CSS 文件时，Highcharts 现在会主动警告。

这不是功能升级，这是工程健壮性升级。

Highcharts 正在明确一个态度：

我不只负责画图，我还要帮你减少生产事故。

3. 各产品线针对性增强

Highcharts Stock：金融级可视化继续"去碎片化"

• 导航绑定自定义类名 ：navigation.bindings 新增 className 选项，支持通过CSS深度自定义标注样式

• 指标文件精简 ：EMA指标文件已整合至 indicators.js，减少加载依赖

• 联动序列继承 ：linked series 链接序列现在可继承父级的 compare 选项，保持分析模式一致

Stock 12.5 的关键词只有一个：整合。

------EMA 指标文件移除：不是砍功能，而是去冗余。EMA 被并入 indicators.js，这背后是：

• 更清晰的模块边界

• 更少的文件依赖

• 更简单的构建与加载策略

这对大型项目尤其重要。

------linked series 继承 compare：金融分析逻辑更自然。联动序列继承 compare 选项，解决的是：

• 对比分析不一致

• 多序列金融图中"语义割裂"的问题

这是一个非常典型的 "金融用户驱动型优化"。

------annotations 支持 className：样式控制权回到 CSS。annotations 支持 className，意味着：

• 标注可以被统一主题管理

• 不再依赖内联样式

• 与企业级 CSS 体系完全兼容

这是让工程师少踩坑、系统更稳、长期更好维护。

Highcharts Maps & Gantt：细节更新，但方向一致

Highcharts Maps：地理数据更清晰

• 优化MapPoint工具提示 ：改进了默认的 tooltip.pointFormat，使地图点数据展示更加直观明了

Highcharts Gantt：同步核心升级

项目计划图用户可享受所有Highcharts核心优化带来的体验提升。

它们传递的是：Highcharts 正在确保所有产品线，都共享同一套成熟能力。

4. 另一个重头戏：Highcharts Grid 2.2发布

Highcharts Grid 2.2.0：性能与功能的双重飞跃

作为本次发布的另一大亮点，Highcharts Grid迎来2.2.0版本，带来多项生产级改进：

• 单列 / 多列排序（支持 Shift 叠加）

• 单元格、列级别主题化

• 虚拟滚动性能大幅优化

• 更完整的无障碍（Screen Reader）支持

• 更合理的 API 命名与弃用策略

1. 多列排序支持

• Shift+点击实现多列排序：用户可按住Shift键点击多个列头，实现复杂的多级数据排序

• API统一化 ：sorting.sortable 已弃用，统一使用 sorting.enabled，提升配置一致性

2. 性能大幅优化

• 虚拟化增强：通过重用行元素、批量处理滚动更新，显著提升大数据集的渲染性能

• 事件监听器精简：减少单元格上的事件监听器数量，降低内存占用

3. 数据验证扩展

新增三种验证器：

• arrayNumber：验证数值数组

• json：验证JSON格式

• sparkline：验证迷你图数据格式

4. 可访问性提升

• 为屏幕阅读器添加前后区域标识，改善视障用户的使用体验

• 支持通过索引数组批量删除行：dataTable.deleteRows([1, 3, 5])

5. 主题定制更灵活

增强CSS变量支持，允许对单个列、单元格等进行细粒度主题定制，新增悬停透明度变量。

开发者价值总结

Highcharts 12.5 它的价值体现在：

• 复杂结构数据

• 样式体系与设计系统融合

• 工程健壮性

• 图表 + 表格的一体化演进

Highcharts 正在：把企业级可视化从"工具集合"，慢慢打磨成"长期平台"。

如果你正在构建的是：

• 企业 BI

• 金融分析系统

• 运维监控平台

• 数据中台前端

那你会意识到：
Highcharts 正在越来越懂"工程师真正的痛点"。

Highcharts 12.5 没有刻意追求"看起来很强"，而是继续走它一贯的路线：把工程这件事，认真做到位。

通过更明确的配置提醒、更贴近标准的 CSS 能力、更克制但精准的 API 调整，Highcharts 在告诉开发者一件事：

成熟的可视化库，是让你的系统在三年、五年后，依然稳定、可维护、可演进。

Highcharts 12.5 的更新，再一次强化了这一点。

"它不是为展示而生的版本，而是为工程寿命而生的版本。"

升级指南与注意事项

兼容性说明

Highcharts v12.5.0保持向后兼容，现有图表无需修改即可正常运行。

重点检查项

1. Stock用户 ：如果项目中直接引用了EMA独立文件，请更新为完整的indicators.js

2. Grid用户 ：将sorting.sortable替换为sorting.enabled

3. 样式模式用户：确保必要的CSS文件已正确加载

获取方式

• NPM : npm install highcharts@12.5.0 highcharts-grid@2.2.0

• CDN : https://code.highcharts.com/12.5.0/

• 官网下载: Highcharts官方下载中心

立即升级，体验更强大的数据可视化能力！