I'm using a Kendo Pie Chart and I want to configure this to display a message if there is no data to display. I am configuring the pie chart with the following js function - with the variable "JsPieChartDataSet" being a set of JSON formatted data.
Is there a property that can be set to display a message when no data exists?
function pieType() {
/*Pie chart render*/
$("#piechart").kendoChart
({
theme: $(document).data("kendoSkin") || "metro",
title: { visible: true, color: "black", margin: 0, text: JsBreakdownPieTitle },
legend: { position: "bottom", margin: 0 },
seriesDefaults:
{
labels: {
template: "#= kendo.format('{0:P}', percentage)#",
font: "8pt Arial, Helvetica, sans-serif",
visible: true,
distance: 10
},
type: "pie"
},
series: JsPieChartDataSet,
tooltip: {
visible: true,
format: "{0:N2} tCO2e",
font: "10px Arial, Helvetica, sans-serif"
}
});
}
Kendo Pie Chart does not have any build-in mechanism to display a message if there is no data.
You can hide the chart and display the message by yourself, if there is no data available. See example below.
HTML:
<div id="noDataNotification" style="display: none;">No data exists.</div>
JS:
if (JsPieChartDataSet.Items.Count == 0)
{
yourPie.Visible = false;
$("#noDataNotification").show();
}
PS. Similar question is discussed in Telerik forum: http://www.telerik.com/forums/no-data-message-pie-chart
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With