带运动的HighCharts热图

Question

需要创建一个运动高图表，我已经做了一个小提琴来解释我已经做了什么。但需要使工作的运动播放按钮不工作，运动将工作点击按钮，它会改变框的颜色取决于随机值，运动条将在时间范围内。

https://jsfiddle.net/4aqhB/981/

运动和序列调用：

    motion: {
    enabled: true,
    axisLabel: 'year',
    labels: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
    series: [0],
     // The series which holds points to update
    updateInterval: 1,
    magnet: {
        type: 'both', // thumb / point / both
        round: 'floor', // ceil / floor / round
        smoothThumb: true, // defaults to true
        step: 0.01
    }
},
    series: [{
        name: 'Heat Map',
        borderWidth: 1,
        data: [[0,0,10],[1,0,5],[2,0,3]],
        }]

Answer 1

热图的结构如下所示：

{
  x: Number
  y: Number
  value: Number
  ...
}

此外，对于运动插件，点需要sequence属性，它是一个热图点数组-它可能是一个部分对象-如果你想更新点的值(热图上的颜色)，那么序列中的点应该如下所示：

{ value: Number }

本系列示例：

series: [{
  name: 'Heat Map',
  borderWidth: 1,
  data: [{
    x: 0,
    y: 0,
    sequence: [{
      value: 10
    }, {
      value: Math.random() * 10
    }, {
      value: Math.random() * 10
    }]
  }, {
    x: 1,
    y: 0,
    sequence: [{
      value: 5
    }, {
      value: Math.random() * 5
    }, {
      value: Math.random() * 5
    }]
  }, {
    x: 2,
    y: 0,
    sequence: [{
      value: 3
    }, {
      value: Math.random() * 3
    }, {
      value: Math.random() * 3
    }]
  }]
}]

示例：https://jsfiddle.net/k4d8okt8/