javascript - Highcharts Pie Charts Show Outline When Empty -
i have pie chart displaying on reporting dashboard. however, business request made retain chart outline , display 'nodata' message in center when series empty.
the business did not of floating label on page when chart empty. using existing chart object, possible fabricate chart outline , display nodata message?
it possible add custom shape, e.g. circle, showing in case there no data. using chart's events load , redraw can update shape fit in chart , placed in center or remove when data added chart.
api reference renderer.circle: http://api.highcharts.com/highcharts#renderer.circle
example: http://jsfiddle.net/v8n1159o/1/
chart: { events: { load: function () { var chart = this; if (!chart.hasdata()) { var r = math.min(chart.plotwidth / 2, chart.plotheight / 2), y = chart.plotheight / 2 + chart.plottop, x = chart.plotwidth / 2 + chart.plotleft; chart.pieoutline = chart.renderer.circle(x, y, r).attr({ fill: '#ddd', stroke: 'black', 'stroke-width': 1 }).add(); } }, redraw: function () { var chart = this; if (chart.pieoutline && chart.pieoutline.element) { if (chart.hasdata()) { chart.pieoutline.destroy(); } else { var r = math.min(chart.plotwidth / 2, chart.plotheight / 2), y = chart.plotheight / 2 + chart.plottop, x = chart.plotwidth / 2 + chart.plotleft; chart.pieoutline.attr({ cx: x, cy: y, r: r }); } } else if(!chart.hasdata()) { var r = math.min(chart.plotwidth / 2, chart.plotheight / 2), y = chart.plotheight / 2 + chart.plottop, x = chart.plotwidth / 2 + chart.plotleft; chart.pieoutline = chart.renderer.circle(x, y, r).attr({ fill: '#ddd', stroke: 'black', 'stroke-width': 1 }).add(); } } }, ...
Comments
Post a Comment