Wordcloud animation sorted data

by kzoon

HTML

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/wordcloud.js"></script>
<div id="container" style="height: 500px; width: 1000px;"></div>
<button id="update">Update chart</button>

JavaScript

(function(H) {
  H.wrap(
    H.seriesTypes.wordcloud.prototype,
    'setData',
    function(proceed, data, ...args) {
      data = data.sort(function(p1, p2) {
        return p2.weight - p1.weight;
      });

      return proceed.apply(this, [data, ...args]);
    }
  );
})(Highcharts);

var myData = [{
    "name": "Total Prod",
    "weight": 409713,
    "color": "rgba(68,114,196,1)"
  },
  {
    "name": "Audio Div",
    "weight": 221629,
    "color": "rgba(237,125,49,1)"
  },
  {
    "name": "Aud Comps",
    "weight": 181526,
    "color": "rgba(165,165,165,1)"
  },
  {
    "name": "Video Div",
    "weight": 171528,
    "color": "rgba(255,192,0,1)"
  },
  {
    "name": "Camcorder",
    "weight": 128568,
    "color": "rgba(91,155,213,1)"
  },
  {
    "name": "CD",
    "weight": 57130,
    "color": "rgba(112,173,71,1)"
  },
  {
    "name": "Amplifier",
    "weight": 51234,
    "color": "rgba(68,114,196,1)"
  },
  {
    "name": "HD Cam",
    "weight": 48874,
    "color": "rgba(237,125,49,1)"
  },
  {
    "name": "Receiver",
    "weight": 47122,
    "color": "rgba(165,165,165,1)"
  },
  {
    "name": "Web Cam",
    "weight": 43142,
    "color": "rgba(255,192,0,1)"
  },
  {
    "name": "Port Audio",
    "weight": 40103,
    "color": "rgba(91,155,213,1)"
  },
  {
    "name": "Hi8 Camcord",
    "weight": 36552,
    "color": "rgba(112,173,71,1)"
  },
  {
    "name": "DVD",
    "weight": 22034,
    "color": "rgba(68,114,196,1)"
  },
  {
    "name": "TV",
    "weight": 20926,
    "color": "rgba(237,125,49,1)"
  },
  {
    "name": "MP3",
    "weight": 18441,
    "scIndex": 14,
    "color": "rgba(165,165,165,1)"
  },
  {
    "name": "Accessory Div",
    "weight": 16556,
    "color": "rgba(0,255,0,1)"
  },
  {
    "name": "Home Cinema",
    "weight": 15514,
    "color": "rgba(91,155,213,1)"
  },
  {
    "name": "BlueRay €£âë Player",
    "weight": 12125,
    "color": "rgba(112,173,71,1)"
  },
  {
    "name": "Boombox",
    "weight": 12032,
    "color": "rgba(68,114,196,1)"
 ...