Stacked Report is not generating

[Venkat]

Hi,

I am trying create Stacked Chart based on the demo example
from this url:
http://demos.telerik.com/aspnet-mvc/bar-charts/stacked-bar

But
the Stacked chart is not displaying any bar when the Data source is set.
I am able to get the Stacked Report using Report Designer from the same
Data source but not in Kendo Charts.

Here I have attacked the
Image of the my chart, sample data source in excel for your reference
and using below code to generate the report.

----- Code --

    @(Html.Kendo().Chart<IMF.CurrencyAssignmentSystem.Models.ReceiptAllocationDetails>()
        .Name("chart")
        .Title("Pre Transaction Position")
        .Legend(legend => legend
            .Position(ChartLegendPosition.Bottom)
        )
        .DataSource(ds => ds
                .Read(read => read.Action("GetChartDetails", "ReceiptAllocation"))
                .Group(group => group.Add(model => model.ResourceType))
        )
        .SeriesDefaults(seriesDefaults =>
            seriesDefaults.Bar().Stack(true)
                    .Field("PreTransactionPosition")
        )
        
        .Series(series =>
        {
            series.Column(model => model.PreTransactionPosition).Stack("N").GroupNameTemplate("PreTransaction");
        })
        .CategoryAxis(axis => axis
            .Categories(model => model.LenderId)
            .MajorGridLines(lines => lines.Visible(false))
        )
        .ValueAxis(axis => axis
            .Numeric()
            .Labels(labels => labels.Format("{0}"))
            .Line(line => line.Visible(false))
            .MajorGridLines(lines => lines.Visible(true))

        )
        
        .Tooltip(tooltip => tooltip
            .Visible(true)
        )
    )

--------

Here
I am trying to group it on the ResourceType field to get the Bars,
Lender Id on Axis and the value should be taken to create Stack Bar is
PreTransactionPosition.

I have tried doing several changes for the moving the fields in different places but could not get the chart.

Request you to look at these and give your suggestions.

Regards!

[Iliana Dyankova]

Hi Venkat,

I don't believe the reason for the illustrated issue is in the provided chart configuration - I tested it on my side and the chart is rendered as expected. Could you please make sure the "PreTransactionPosition" field is not string. In case the type is correct but the issue still persists I will need an isolated runnable example which I can debug locally - this way I would be able to advice you further and provide concrete recommendations. 

On a side note, GroupNameTemplate is obsolete - specify the group name template as 'series.name'.

Regards,
Iliana Nikolova
Telerik

 

 

[Venkat]

Hi Iliana,

Thanks for your reply.

Yes, the 'PreTransactionPosition' field is Decimal column and still the issue exists.

As you have mentioned to send a runnable example, here I have attached my code zip. You can access the link is:

/ReceiptAllocation/DisplayChart

For you convenience I have set the Json data and which has been used in the ReceiptAllocation controller under DisplayChart method.

Before working on Stacked Report on Kendo UI, I have generated the Stacked Chart by using Report Designer with same data and query. I have attached a screen shot of the same for your reference.

So, I am trying to create a report in same way in Kendo.

I request you to check the these give your valuable suggestions as soon as earliest.

Regards!

[Venkat]

Hi Iliana,

I am Sorry, I had forgot the Model Class file to attach in the earlier zip file. Can you please take this version of the zip and check?


Regards!

[Venkat]

Hi,

We have very urgent requirements to develop 7-8 charts and this has become door stopper! :(

So, some one please check my attached files and can you give your valuable suggestions to resolve this issue?

Regards!

[T. Tsonev]

Hi,

Thank you for sending the relevant project files.

From what I can see the controller is returning a JSON document wrapped as a Json() response.
This is not valid as the JsonHelper expects collection of model objects. It will handle the serialization internally.

The action should look more like:
[HttpPost]
public ActionResult GetChartDetails()
{
   ReceiptAllocationDAO receiptAllocationDao = new ReceiptAllocationDAO();
   var chartDetails = receiptAllocationDao.GetReceiptAllocationList();

   return Json(chartDetails);
}


I see that the chart is bound to the model fields, but their serialized names are overridden:
[JsonProperty("V_RESOURCE_TYPE")]
public string ResourceType { get; set; }

The JsonProperty attributes should be removed otherwise the binding fields won't match.
I hope this helps.

Regards,
T. Tsonev
Telerik

 

 

[Venkat]

Hi T. Tsonev,

Thanks for reply.

With respect to the Json value, which I have mentioned in Controller was for your reference to look at the data. The method which I calling to get the Details that will return the data like was is send to you.

With respect to the Json Attribute:

Right now we are getting the query result as Json value from Oracle DB. That is returning the column or Json Property name as: V_RESOURCE_TYPE, V_LENDER_ID and so on. To maintain the Proper Naming convention for Class Properties we have it as "ResourceType, LenderId and so on. When we Serialize this Json data to Class Object needs to be mapped. So, we have used Json Attribute to each class property.

But still will try with your suggestion and check. Will let you know the details soon.

Regards!

[Venkat]

Hi T. Tsonev,

I would like to tell you that I am able to get the Stacked Chart now. I just changed the return value from Json String to IList<T> and it made the trick!!!

And more thing is we no need to remove the Json Attribute from the Model Class, even with the Json Propery the chart is able to render it.

Thank you very much for your help and mark your reply to Answered!!

Regards!