Highcharts 带时间线的热图

我正在尝试用X轴上的时间线绘制热图，并且能够在一个时间间隔内显示一个单元格，从一个日期到另一个日期

这就是我希望通过highcharts实现的目标：

在热图中，单元格接收以下数据：[行、列、值]

因此，我尝试了3种方法来实现这一点：

1.-Have as data[row，date（作为日期对象），value]->Highcharts error#19（我想一个轴的刻度太多了，但我有一个刻度间隔）

2.-作为数据[行、日期（作为日期对象）、值]和

xAxis: {
        type: 'datetime',
    },

xAxis: {
        type: 'datetime',
    },

这就是我得到的：

3.-具有数据[行、日期（毫秒）、值]和

xAxis: {
        type: 'datetime',
    },

xAxis: {
        type: 'datetime',
    },

-->仍然没有显示数据，但XAXIS看起来还可以

这就是我从3中得到的：

这是大量的数据，第一行有450个单元格，第二行有350个单元格，第三行有50个单元格，但可能更多

（在我的例子中，行和列是交换的，因此数据是[column，row，value]，如右下角所示）

这是当我将整数作为列（1,2,3..）而不是日期（ms或date对象）时得到的结果： -->这是可行的，但数据并不像我想的那样在时间线上

如果我能把热图单元格显示在它应该去的地方，我想我可以用colsize做间隔

series: [{
        name: '',
        borderWidth: 0.4,
        borderColor: 'black',
        data: myData,
        dataLabels: {
            enabled: false,
            color: 'black',
            style: {
                textShadow: 'none',
                HcTextStroke: null
            }
        },
    }],

    chart: {
        type: 'heatmap',
        marginTop: 80,
        marginBottom: 100,
        width: 1000,
        height: height
    },

    title: {
        text: title,
        style: {
          font: "30px Helvetica Neue, Helvetica, Arial Unicode MS, Arial, sans-serif",
        }
    },
    subtitle: {
      text: subtitle,
      style: {
        font: "15px Helvetica Neue, Helvetica, Arial Unicode MS, Arial, sans-serif",
        color: "#000000"
      },
     xAxis: {
        type: 'datetime',
    },
    yAxis: {
        categories: yAxisCategory, //Array with the 3 names shown in the img
        title: null,
        labels: {
          style: {
            font: "14px Helvetica Neue, Helvetica, Arial Unicode MS, Arial, sans-serif",
            color: '#000000',
          }
        },

    },
    colorAxis: {
        min: 0,
        max: 1,
        minColor: '#a50022',
        maxColor: '#007340',
        gridLineColor: '#000000',
        stops: [
            [0, '#a50022'],
            [0.5, '#fffbbc'],
            [1, '#007340']
        ],
    },

    legend: {
        enabled: legendEnabled,
        symbolHeight: 18,
        y: 40,
        symbolWidth:900,
    },

---

我认为您需要使用

colsize

选项来通知Highcharts图表上每个矩形的宽度。大概是这样的：

函数生成数据（）{
var d=[]；
对于（变量i=0；i<100；i++）{
d、 推送（[Date.UTC（2013，0，i），Math.round（Math.random（）*2），Math.random（）*10]）
}
返回d；
}
$（“#容器”）。高图({
图表：{
类型：“热图”
},
xAxis：{
键入：“日期时间”
},
亚克斯：{
类别：['a'，'b'，'c']
},
系列：[{
colsize:24*36e5，//一天
数据：generateData（）
}]
});

我想将此“样条曲线”作为热图：但它们的大小都相同，对吗？同一行中不能有一个单元格比另一个单元格大，这就是热图类型的工作原理。如果要显示更长的单元格，只需创建多个单元格。不管怎么说，在你的截图中，它们看起来都一样宽。不，不，最后一行（底部）的那些要大得多。创建多个不相同且不起作用：（抱歉，每个系列的热图限制为相同的单元格大小/行大小。您始终可以将相同大小的单元格分组到系列中，然后显示。