用于多类别日期时间数据的HeatMap或ColumnChart想法

Question

我想创建一个如下图的图表 每个点都有x，值，cat1，cat2

x轴具有DateTime数据 y轴可以是类别cat1。我希望cat2作为子类别/作为类比，可能是高图表系列

请不要建议采用cat1 cat2的笛卡尔积并绘制单个类别，因为这会挤满图表并失去通过cat2选择的功能

Cat1和cat2彼此不相关。只需将其视为每个数据点的2个枚举标签即可。

例如，对于每天售出的汽车，例如Cat1 = [掀背车，轿车...]，Cat2 = [黄色，红色，绿色]等。

这是一个非常琐碎的用例，我很难相信highchart不能让我这样做。我确定我想念一些东西。因为我已经尝试了几种方法并花费了大量时间，所以任何示例或帮助将不胜感激

这个想法不是要混合使用列系列或热图系列。我对所有系列都可以使用相同的类型，我个人更喜欢使用热图解决方案

Answer 1

您可以创建两个单独的heatmap图表，它们都具有两行数据：

Highcharts.chart('container', {
    ...,
    xAxis: {
        type: 'datetime',
        visible: false
    },
    series: [{
        type: 'heatmap',
        data: [
            [0, 0, 10],
            [1, 0, 19],
            [2, 0, 8],
            [3, 0, 24],
            [4, 0, 67],
            [0, 1, 92],
            [1, 1, 58],
            [2, 1, 78],
            [3, 1, 117],
            [4, 1, 48]
        ],
        ...
    }]
});

Highcharts.chart('container2', {...});

实时演示： https://jsfiddle.net/BlackLabel/jLbvw43z/

文档： https://www.highcharts.com/docs/chart-and-series-types/heatmap