What if, all y : data is 0 ?

[nik.sol]

If i input 0 for all value of y: in datapoint pie-chart, chart doesn’t show-up/render.

Is it possible to display a message like : “No Data found!” for a particular canvas chart.

[nik.sol]

Example :
<script type=”text/javascript”>
window.onload = function () {
var chart = new CanvasJS.Chart(“chartContainer”,
{
theme: “theme2”,
title:{
text: “Gaming Consoles Sold in 2012”
},
data: [
{
type: “pie”,
showInLegend: true,
toolTipContent: “{y} – #percent %”,
yValueFormatString: “#,##0,,.## Million”,
legendText: “{indexLabel}”,
dataPoints: [
{ y: 0, indexLabel: “PlayStation 3” },
{ y: 0, indexLabel: “Wii” },
{ y: 0, indexLabel: “Xbox 360” },
{ y: 0, indexLabel: “Nintendo DS”},
{ y: 0, indexLabel: “PSP” },
{ y: 0, indexLabel: “Nintendo 3DS”},
{ y: 0, indexLabel: “PS Vita”}
]
}
]
});
chart.render();
}
</script>

[Sanjoy]

@nik-sol,

Please take a look into this jsfiddle.

—
Sanjoy Debnath
Team CanvasJS

[nik.sol]

@Sanjoy,

Great .! Thanks for the info.

—

nik.sol

[nik.sol]

@sanjoy,

One more help in similar case,
We need to hide legends in this situation as well.

—

nik.sol

[nik.sol]

@sanjoy,

I did this to achieve my functionality..

function showDefaultText(chart, text){
	 var dataPoints = chart.options.data[0].dataPoints;
   var isEmpty = !(dataPoints && dataPoints.length > 0);
   
   if(!isEmpty){
   	for(var i = 0; i < dataPoints.length; i++){
      isEmpty = !dataPoints[i].y;
      dataPoints[i].indexLabel = '';
    	if(!isEmpty)
        break;
    }
   }
  
   if(!chart.options.subtitles)
   	chart.options.subtitles = [];
   if(isEmpty)
   	chart.options.subtitles.push({
     text : text,
     verticalAlign : 'center',
   });
   else
   	chart.options.subtitles = [];
 }

Let me know if there is better way of doing it.

—

nik.sol

[nik.sol]

Did some more changes..

Using this :

if(isEmpty){
  <strong> for(var i = 0; i < dataPoints.length; i++){
      dataPoints[i].indexLabel = '';
   }</strong>
   chart.options.subtitles.push({
     text : text,
     verticalAlign : 'center',
   });
}

Instead of :

if(!isEmpty){
   	for(var i = 0; i < dataPoints.length; i++){
      isEmpty = !dataPoints[i].y;
     <del datetime="2018-01-03T09:35:27+00:00"> dataPoints[i].indexLabel = '';</del>
    	if(!isEmpty)
        break;
    }
   }

—

nik.sol

[Sanjoy]

nik.sol,

One more help in similar case,
We need to hide legends in this situation as well.

You can achieve this by toggling showInLegend property. Please take a look at this updated jsfiddle.

—
Sanjoy Debnath
Team CanvasJS

[Author]

Posts