Highcharts热图显示不正确

Highcharts heat map not displaying properly

本文关键字：不正确 显示 Highcharts      更新时间：2023-09-26

我试图使用Highcharts创建一个热图，但它没有正确加载（只是线条而不是热图本身）。

我正在从JSON文件加载数据：

chart: {
  type: 'heatmap',
  marginTop: 40,
  marginBottom: 80,
  plotBorderWidth: 1
},
xAxis: {
  categories: $scope.loadDays()
},
yAxis: {
 categories: $scope.loadHours(),
 title: null,
 reversed: true
},
series: [{
  name: null,
  borderWidth: 1,
  data: [],
  dataLabels: {
    enabled: true,
    color: '#000000'
  }
}]
$scope.getHeatMapData = function(data) {
  var response = [];
  $scope.data = data;
  if(data && $scope.data.timestamps && $scope.data.info) {
    $scope.data.timestamps.forEach(function(element, index) {
      if ($scope.data.info[index]) {
        response.push([
          moment(element).day(),
          moment(element).hour(),
          $scope.data.info[index]
       ]);
      }
    });
  }
  return response;
};

数据被正确记录到控制台，但由于某种原因，热图没有加载。

我还创建了一个Plunker，在那里你可以看到它的行为。

有什么想法吗？

我在重新加载图表时犯了一个错误。我只需要将类型添加到事件中：

chartConfig.chart = { type: 'heatmap', events: { load: callback } };

Plunker

相关文章：