在 Highcharts 中实现 Marimekko可变宽度图｜示例教程

定义数据世界里有一种图表看起来像一堵被精心切割的彩色砖墙。每一块砖不仅有高度还有宽度两种维度同时在讲故事。这就是 Marimekko Chart可变宽图。在 Highcharts 里它是一种非常有商业分析味道的高级图表。先把概念说清楚。普通柱状图只有一个核心变量高度。Marimekko 图则有两个高度表示一个指标例如市场占比、销售额或利润率。宽度表示另一个指标例如市场规模、客户数量或地区体量。于是每个矩形的面积就代表综合数据量。这种设计让一张图同时表达三件事一个类别的规模该类别内部的结构不同类别之间的对比可变宽度图 Marimekko Chart可变宽图是一种柱状图其中每一列都有单独的宽度来表示第三个维度。可变图表与Marimekko图表相关但是Marimekko计算堆栈的宽度以填充整个绘图区域而可变图表只是让列的宽度反映一个值。有关更详细的Highcharts示例和文档请查看API..点击这里查看代码。Highcharts数据结构variwide系列使用两个选项y和z。y选项决定了列的高度就像普通的列图一样z选项决定了列的宽度。查看API选项了解更多详细信息。商业分析里这非常有价值。在统计和商业咨询领域Marimekko 图常被称为 Mekko Chart 或 Market Structure Chart。很多咨询公司在市场分析报告里会用这种图因为它能把“市场规模 市场份额”同时表达出来。举个直观例子。假设分析手机市场横轴宽度表示各品牌市场规模纵轴高度表示不同产品线占比最后你会看到一张结构图大品牌的列更宽产品线占比决定每一块的高度整张图像一面拼接的彩色墙一眼就能看出谁占市场、谁结构复杂。在 Highcharts 中实现 Marimekko 图需要使用 variwide 模块。因为可变宽图本质上是一个“宽度可变的柱状图”。