Highcharts 热图不呈现正方形或矩形答案

【问题标题】：Highcharts heatmap not rendering squares or rectanglesHighcharts 热图不呈现正方形或矩形
【发布时间】：2020-05-12 06:19:52
【问题描述】：

谁能帮我理解这里出了什么问题。一切似乎都很完美。

http://jsfiddle.net/prakash4mail/nt86gj7z/1/

$(function () {

    $('#container').highcharts({

        chart: {
            type: 'heatmap',
        },
        colorAxis: {
            min: 0,
            minColor: '#FFFFFF',
            maxColor: Highcharts.getOptions().colors[0]
        },


        series: [{
            borderWidth: 1,
            data: [[2020-04-01, 18000, 29060],[2020-04-01, 18500, 9920],[2020-04-01, 19000, 32160],[2020-04-02, 18000, 12400],[2020-04-02, 18500, 91880],[2020-04-02, 19000, 54000],[2020-04-03, 18000, 63540],[2020-04-03, 18500, 43420],[2020-04-03, 19000, 43420]],
            dataLabels: {
                enabled: true,
                color: '#000000'
            },
        }]

    });
});

heatMap showing lines instead of squares

【问题讨论】：

标签： highcharts heatmap

【解决方案1】：

确切的答案是 rowsize: 500（从 UI 角度看 - 高度，每个点之间的 YAxis 差异）和 colsize: 86400000（一个每天，每个点之间的 x 轴差异）。缺少这个会导致框不出现。

【讨论】：

【解决方案2】：

据我了解，您希望实现类似于此处呈现的内容：http://jsfiddle.net/BlackLabel/o6ywag42/

注意这个来自 Highcharts 演示库的演示中的数据结构的样子： https://jsfiddle.net/BlackLabel/uofntb4y/ - 如果您想将点保持为正方形，则“y”值必须逐个增长，例如：http://jsfiddle.net/BlackLabel/o7bgq1pu/

为了显示您真正的 y 比例，您可以使用类别功能。

yAxis: {
    categories: ['18000', '18500', '19000']
},

API：https://api.highcharts.com/highcharts/yAxis.categories

编辑：

@prakash 建议的另一个解决方案是使用 series.rowsize 属性和 series.colsize 来适应正方形。

API：https://api.highcharts.com/highcharts/series.heatmap.rowsize

API：https://api.highcharts.com/highcharts/series.heatmap.colsize

【讨论】：

准确答案是rowsize: 500（从UI视角高度，每个点的Y轴差）和colsize: 86400000（每天一天，每个点之间的 x 轴差异）。缺少这个会导致框不出现。
哦，你说得对，这是另一个很酷的解决方案。感谢分享！
您能否也用这个编辑您的主要答案（也保留您的项目）&我会将其标记为已解决。这样如果其他人提到它，他们就会知道
@prakash 是的，当然！