We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to fully reinitialize chart control

Thread ID:

Created:

Updated:

Platform:

Replies:

123521 Mar 24,2016 04:21 PM UTC Mar 25,2016 11:23 AM UTC ASP.NET MVC 1
loading
Tags: Chart
Yauhen Filipskikh
Asked On March 24, 2016 04:21 PM UTC

Hello All,

We are trying to create chart, data in which could be switched.
In the bottom of page there is switcher/link that control what data to show.
We are using javascript version. The problem is that we need not only change datasource, but all including axes properties, zoom levels,
datalabels etc. So generally 2 versions could look completely different. We just want to preserve chart size, names of axes and some general properties including chart type.
Everything related to data could differ. We tried to use   $("#container").ejChart(chartProperties); when switching datasource. But it just create second chart over first seem to me, because datalabels are mixed. We tried $("#container").ejChart("instance").model = chartProperties; it also fails. Are there any possibilities? We don't want blinking of chart due of recreation/destroy. But could not find any good way. 

I have attached our sample cshtml.


Attachment: Index_99e11900.zip

Akbar Basha K M [Syncfusion]
Replied On March 25, 2016 11:23 AM UTC

Hi Yauhen,

Thanks for contacting syncfusion support. We have analyzed your reported query and we suggest to use, set the null value to the properties before passing the data to the chart.
Currently we are changing series property based on your scenario. Please find the below code snippet,

           

            $("#lnkSerie1").click(function (event) {

                event.preventDefault();

                var chartModel = $("#container").ejChart("instance").model;

                // calling function to set the null value

                setNull(chartModel, chartProperties);

                $("#container").ejChart(chartProperties);

           });

           

             function setNull(model, options) {

                 for (var prop in options) {

                    switch (prop) {

                       case "series":

                         model.series = [];

                         break;

                    }

                 }

             }




Output image:
When clicking on series2 link

When clicking on series1 link


We have prepared a sample based on this. Please find the sample below location,

Sample Location : http://www.syncfusion.com/downloads/support/forum/123521/ze/SyncfusionMvcApplication5-883502915
Thanks,
Akbar Basha KM.

CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;