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/