title: how to sort and select top 5 elements in a json array using angular JS
body: <p>I have a REST API which returns a Java.util.HashMap object as JSON.</p>
  
  <p>It has data in the form (some 15-20 elements like this):</p>
  
  <pre><code>"entity": {
      "element1": 15,
      "element2": 26,
      "element3": 37,
      "element4": 45
  }
  </code></pre>
  
  <p>I am calling the API and getting this map in my Angular JS application as follows:</p>
  
  <pre><code>url = 'http://localhost:8080/dummy/';
  console.log(url);
  $http.get(url).success(function(data) {
      var elements = [];
      var counts = [];
      var mymap = data.entity;
      console.log(mymap);
      Object.keys(mymap).forEach(function(key) {
          elements.push(key);
          counts.push(mymap[key]);
      });
  })
  </code></pre>
  
  <p>Next, I am using this to display it as a bar graph in the UI using high charts:</p>
  
  <pre><code>Highcharts.chart('hc-container', {
  chart : {
      type : 'bar'
  },
  title : {
      text : 'Top 5 element count'
  },
  xAxis : {
      categories : elements
  },
  series : [ {
      name : 'count',
      data : counts
  } ]
  });
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;body ng-controller="myController"&gt;
    &lt;div id="hc-container"&gt;Placeholder for chart&lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>Now currently it is showing all the elements from the map. I only need the top 5 elements with the highest counts to be displayed in the bar graph. </p>
  
  <p>How can I do that?</p>