No Data message Pie chart in UI for ASP.NET AJAX Chart (HTML5)

RBeco

15 posts

Member since:
Apr 2013

Posted 23 Apr 2013 Link to this post

Hello,

Is there something like a 'no data message'? And if so, is this customizable? I want to show a nice image and some text when a chart contains no data.

Thanks!

Stamo Gochev

Admin

218 posts

Posted 26 Apr 2013 Link to this post

Hello Ramaka,

As the main idea of the RadHtmlChart is to do a data visualization, there is no need to show the chart without any series items. What you can do in case there is no data to be displayed, is to set the Visible="false" property, which will hide the chart:

BarSeries bar = new BarSeries();

Chart.PlotArea.Series.Add(bar);

if (bar.Items.Count == 0)

{

Chart.Visible = false;

}

In order to show an image or a text when the RadHtmlChart doesn't have any data, you can use a <asp:Panel> and add an Image or a Label to it. The following code snippet demonstrates this approach:

panelImage.Visible = true;

panelImage.BackImageUrl = "telerik.jpg";

//add text

Label label = new Label();

label.Text = "Welcome to our site";

label.BackColor = Color.White;

panelImage.Controls.Add(label);

I attach a sample page, which shows the methods for displaying an image - either adding it as an Image object or setting the BackImageUrl property of the <asp:Panel>. You could have a look at it for further clarification.

Regards,
Stamo Gochev
the Telerik team

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.

Hide-Chart.zip

RBeco

15 posts

Member since:
Apr 2013

Posted 14 May 2013 Link to this post

Thanks! I got this up and running fine now

Dhairya

3 posts

Member since:
Jun 2012

Posted 19 Jun 2013 Link to this post

I have similar question but for ASP.Net MVC pie chart and column chart. If there isn't any data than instead of displaying blank chart I would like to display message like "no data available".

Following is the way I tried by calling databound method which get called after the data is bound. But how can I check whether the data is passed? or all values are zeros etc.

    .DataBinding(dataBinding => dataBinding
                .Ajax().Select("_GetPieChartData", "Dashboard")
        )

        .ClientEvents(events => events
                         .OnDataBound("onDataBound")
           )

    function onDataBound(e) {
// how can I check whether data is there or not.
    }

Or is there any other way out to set "no data" message for chart without any data or zero values.

thanks,

Stamo Gochev

Admin

218 posts

Posted 24 Jun 2013 Link to this post

Hello,

You can have a look at the following example which demonstrates how you can check if you have an empty datasource. You need to do 2 things in the OnDataBound:

//get the chart

var chart = $("#chart").data("kendoChart");

//check if the datasource is empty

if(chart.dataSource.data().length == 0) {

//do something

}

The example also demonstrates how you can set a message when you do not have any data in the Chart - just append a div with the text you like:

$('<div class="custom-overlay"><p id="message">Some Message Here</p></div>').appendTo("#chart");

Regards,
Stamo Gochev
Telerik

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.

Dhairya

3 posts

Member since:
Jun 2012

Posted 25 Jun 2013 Link to this post

thanks for the reply. But its not working. One change, its not kendo charts its aps.net mVC chart.

I also tried the suggested way but its not getting anything in it. Just to remind again I am using ajax binding of asp.net mvc chart to pull the data.

    function onDataBound(e) {
        //get the chart
        var chart = $("#pieChart").data("tChart");
alert(chart.dataSource.data().length);



        //check if the datasource is empty
        if (chart.dataSource.data().length == 0) {
            //do something
        }

Stamo Gochev

Admin

218 posts

Posted 28 Jun 2013 Link to this post

Hello Dhairya,

If you have any questions regarding the Chart from the Telerik's extensions for ASP.NET MVC, you should ask them in the forum, where you can receive the proper support information you need.

Regards,
Stamo Gochev
Telerik

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.

Dhairya

3 posts

Member since:
Jun 2012

Posted 28 Jun 2013 Link to this post

Hello, I search the forums and found this thread very similar to what I am looking so asked question here. Also I just checked the link you passed on, there is not link to create new thread there. Any guidance. thanks.

Stamo Gochev

Admin

218 posts

Posted 02 Jul 2013 Link to this post

Hello Dhairya,

I have re-checked the status of Telerik Extensions for MVC and I found out that they are not officially supported since Q2 2013. You can find more information about Kendo UI and MVC Extensions in this blog article and also in this FAQ section. If you want to migrate from MVC Extensions to Kendo UI, you can have a look at this article.

Regards,
Stamo Gochev
Telerik

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.

alex

3 posts

Member since:
Aug 2016

Posted 27 Aug 2016 in reply to Stamo Gochev Link to this post

Hello,

In the case of donut chart what would be a good criteria to check if there is any data? For some reason

if (RadHtmlChart2.PlotArea.Series[0].Items.Count == 0) appears always to be true with or without data.

Thank you

Stamo Gochev

Admin

218 posts

Posted 29 Aug 2016 Link to this post

Hi Alex,

I would like to kindly ask you to open a new thread related to your specific problem, so that we can keep this forum post concise.

Please attach a sample page, which demonstrates the problematic behavior, so we can investigate the issue.

Regards,
Stamo Gochev
Telerik by Progress

Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.