javascript - Hide Heatmap DataLabels based on Condition -


how hide datalabels of heatmap based on condition i.e. want hide datalabels (==0 or <50). there bug in highcharts api, when ever restore browser zero's show in unusual order. bug link

as of found workaround replacing 0 '0' dont want show on heatmap. here fiddle jsfiddle , in fiddle working when implemented on application it's replicating bug.

$(function () {      $('#container').highcharts({          chart: {             type: 'heatmap',             margintop: 40,             marginbottom: 40,             plotbackgroundcolor: {                 lineargradient: { x1: 1, y1: 0, x2: 0, y2: 1 },                 stops: [                     [0.03, 'rgb(247, 88, 45)'],                     [0.5, 'rgb(255, 224, 80)'],                     [0.67, 'rgb(54, 64, 207)'],                     [0.99, 'rgb(13, 163, 35)'],                     [1, 'rgb(217, 186, 50']                 ]             }         },           title: {             text: 'sales per employee per weekday'         },          xaxis: {             categories: ['insignificant', 'minimum', 'significant', 'material', 'critical']         },          yaxis: {             categories: ['< 1%', '2-10%', '11-50%', '51-90%', '91-100%'],             title: null         },          coloraxis: {             min: 0,             mincolor: 'transparent',             maxcolor:'transparent'             //maxcolor: highcharts.getoptions().colors[0]         },          legend: {             align: 'right',             layout: 'vertical',             margin: 0,             verticalalign: 'top',             y: 25,             symbolheight: 320         },          tooltip: {             formatter: function () {                 return '<b>' + this.series.xaxis.categories[this.point.x] + '</b> sold <br><b>' +                     this.point.value + '</b> items on <br><b>' + this.series.yaxis.categories[this.point.y] + '</b>';             }         },          series: [{             name: 'sales per employee',             borderwidth: 1,             data: [[0,0,0],[0,1, 0],[0,2,8],[0,3,24],[0,4,67],[1,0,92],[1,1,58],[1,2,78],[1,3,117],[1,4,48],[2,0,35],[2,1,15],[2,2,123],[2,3,64],[2,4,52],[3,0,72],[3,1,132],[3,2,114],[3,3,19],[3,4,16],[4,0,38],[4,1,5],[4,2,8],[4,3,117],[4,4,115]],             datalabels: {                 enabled: true,                 color: 'black',                 style: {                     textshadow: 'none'                 }             }         }]      }); }); 

i'm using jasper studio workaround snippet is

series.datalabels.formatter:{function(){ if(this.point.value == 0) { return '0';} else { return this.point.value;}}} 

the simples way using datalabels formatter allows add condition.

    plotoptions:{         series:{             datalabels:{                 formatter:function(){                      if(this.point.value >=50)                         return this.point.value;                 }             }         }     }, 

example: http://jsfiddle.net/4aqhb/246/


Popular posts from this blog

c# - ODP.NET Oracle.ManagedDataAccess causes ORA-12537 network session end of file -

matlab - Compression and Decompression of ECG Signal using HUFFMAN ALGORITHM -

utf 8 - split utf-8 string into bytes in python -