Hi, All.

I want to redraw the chart after the series data was changed.

Here is my code line which call the ChartEvents redraw.

hcVendas.Appearance = new Highchart.Core.Appearance.Appearance { events = new Highchart.Core.Events.ChartEvents { redraw = "redraw" } };

but it doesn't work.

How to call the redraw events?

Thanks!

Hi dayaue,

I'm guessing that you are trying to redraw the chart when a serie is added to the chart using some means other than C#. To achieve that with the C# properties available to you, , you should try something like the following :

hcVendas.Appearance = new Highchart.Core.Appearance.Appearance { events = new Highchart.Core.Events.ChartEvents { 
addSeries  = "this.chart.redraw();" } };

However, this works only when a new serie is being added to the chart, and not whenever some value in a serie is changed. However, if I'm correct, you are doing all of this in javascript, you do have a variable holding a reference to a serie of the chart. If so, redrawing the chart through javascript can be done in the following manner :

// 1. get a reference to the serie in javascript
var serieReference = someChart.serie[0];

// 2. perform some update action on serieReference.data
...
...

// 3. redraw the chart
serieReference.chart.redraw();

Let us know if you continue to face problems.

Regards,

Rahul

Hi testmyo,

I think I didn't explain what I want to do clearly.

I'm trying to realize a chart by the datetime user selected in the same page. In the first Inquirement, the result is correct . But when user change the selected datetime, the new series will add into the previous chart,. I hope the chart will redraw and show the new series and axis only .

I'm using C# and ASP.net.

Looking for your reply, thanks!

Regards,

Dayaue

In that case, you need to clear out the series for the chart with the following line of code

hcVendas.Series.Clear();

OR

hcVendas.Series = null;
hcVendas.Series = new Serie(); 

This is because the default behavior for the chart control is to add the newly assigned serie to the existing series. So you will need to clear out the existing values before assigning the new serie..

Let us know if it works for you.

Rahul

UPDATE: The first example works; the second one doesn't. That is because in the current implementation of the library, chartName.Series has no publicly accessible setter.

Hi Guys,

My query id : I want to redraw the chart after the series data was changed, data also set the  series but not redraw the chart.

I'm using this code:

SerieCollection series = new SerieCollection();         

  foreach (DataRow dr1 in dsSeries.Tables[0].Rows)     

      {               

hidValues11.Clear();               

hidValues11.Add(Convert.ToInt32(dr1["plt-costs-p01"]));               

yValues = hidValues11.ToArray(typeof(object)) as object[];               

series.Add(new Serie { name = dr1["plt-work-type-desc"].ToString(), data = yValues } );       

    }

AreaChart1.DataSource = series; 

AreaChart1.DataBind();

AreaChart1.Appearance = new Highchart.Core.Appearance.Appearance { events = new Highchart.Core.Events.ChartEvents { addSeries = "this.chart.redraw();" } };

Any Idea about this so please tell me!

Thanks 

Anurag

Try below procedure by passing the data from out in form of DataSet object and refresh the <div> tag in which chart present:

private void LoadPieChart(Object chartData, Int32 chartWidth, Int32 chartHeight)

    {
        try
        {
            divPieChart.Visible = false;

            DataSet dataSet = new DataSet();

            dataSet = (DataSet)chartData;

            // create object arrays and fill the entries
            Int32 totalArraySize = dataSet.Tables[0].Rows.Count;

            Object[] XAxisData = new object[totalArraySize];
            Object[] YAxisServices = new object[totalArraySize];


            int J = 0;
            foreach (DataRow drRow in dataSet.Tables[0].Rows)
            {
                YAxisServices[J] = new object[] { drRow[0].ToString(), Convert.ToInt32(drRow[1].ToString()) };

                J += 1;
            }


            // chart series
            Highchart.Core.SerieCollection series = new Highchart.Core.SerieCollection();

            Highchart.Core.Data.Chart.Serie serieServices = new Highchart.Core.Data.Chart.Serie();
            serieServices.size = 130;
            serieServices.data = YAxisServices;
            serieServices.type = RenderType.pie;
            serieServices.name = "";
            serieServices.showInLegend = false;
            series.Add(serieServices);


            highChartPieChart.PlotOptions = new Highchart.Core.PlotOptions.PlotOptionsPie
            {
                allowPointSelect = true,
                cursor = "pointer",
                dataLabels = new Highchart.Core.PlotOptions.DataLabels { enabled = true, formatter = "this.point.name" },
                animation = false
            };


            highChartPieChart.Tooltip = new ToolTip("''+ this.point.name");

            highChartPieChart.Width = chartWidth;
            highChartPieChart.Height = chartHeight;

            // bind the control
            highChartPieChart.DataSource = series;
            highChartPieChart.DataBind();

            highChartPieChart.Dispose();
        }         
        catch (Exception ex)
        {
            divPieChart.Visible = true;
            divPieChart.Attributes["class"] = "error";
            lblPieChart.Text = string.Format("LoadPieChart={0}", ex.Message);
        }
    }

Not redraw the chart :

 try
            {              
                DataSet dsSeries = new DataSet();
                dsSeries = BindData(plantNo);

                // create object arrays and fill the entries
                Int32 totalArraySize = dsSeries.Tables[0].Rows.Count;

                Object[] XAxisData = new object[totalArraySize];
                Object[] YAxisServices = new object[totalArraySize];


                int J = 0;
                foreach (DataRow drRow in dsSeries.Tables[0].Rows)
                {
                    YAxisServices[J] = new object[] { drRow[0].ToString(), Convert.ToInt32(drRow[1].ToString()) };

                    J += 1;
                }


                // chart series
                Highchart.Core.SerieCollection series = new Highchart.Core.SerieCollection();

                Highchart.Core.Data.Chart.Serie serieServices = new Highchart.Core.Data.Chart.Serie();
                serieServices.size = 130;
                serieServices.data = YAxisServices;
                serieServices.type = RenderType.pie;
                serieServices.name = "";
                serieServices.showInLegend = false;
                series.Add(serieServices);

                AreaChart1.PlotOptions = new Highchart.Core.PlotOptions.PlotOptionsArea {
                    stacking = Highchart.Core.Stacking.normal,
                    lineColor = "#ffffff",
                    lineWidth = 1,
                    fillOpacity = 0.45
                };
              
               
                AreaChart1.Tooltip = new ToolTip("''+ this.point.name");
             

                // bind the control
                AreaChart1.DataSource = series;
                AreaChart1.DataBind();
                AreaChart1.Appearance = new Highchart.Core.Appearance.Appearance { events = new Highchart.Core.Events.ChartEvents { addSeries = "this.chart.redraw();" } };
                AreaChart1.Dispose();
            }
            catch (Exception ex)
            {
              
            }

And I'm also use this code :

            ArrayList hidValues11 = new ArrayList();
            ArrayList hidXCategories11 = new ArrayList();

            DataSet dsSeries = new DataSet();
            dsSeries = BindData(plantNo);

            if (dsSeries == null) return;

            //foreach (DataRow dr in dsSeries.Tables[0].Rows)
            //{
            //    hidXCategories11.Add(dr["plant-no"]);
            //}

            hidXCategories11.Add("JUL");
            hidXCategories11.Add("AUG");
            hidXCategories11.Add("SEP");
            hidXCategories11.Add("OCT");
            hidXCategories11.Add("NOV");
            hidXCategories11.Add("DEC");
            hidXCategories11.Add("JAN");
            hidXCategories11.Add("FEB");
            hidXCategories11.Add("MAR");
            hidXCategories11.Add("APR");
            hidXCategories11.Add("MAY");
            hidXCategories11.Add("JUN");

            //Data
            SerieCollection series = new SerieCollection();
            foreach (DataRow dr1 in dsSeries.Tables[0].Rows)
            {
                hidValues11.Clear();
                hidValues11.Add(Convert.ToInt32(dr1["plt-costs-p01"]));
                hidValues11.Add(Convert.ToInt32(dr1["plt-costs-p02"]));
                hidValues11.Add(Convert.ToInt32(dr1["plt-costs-p03"]));
                hidValues11.Add(Convert.ToInt32(dr1["plt-costs-p04"]));
                hidValues11.Add(Convert.ToInt32(dr1["plt-costs-p05"]));
                hidValues11.Add(Convert.ToInt32(dr1["plt-costs-p06"]));
                hidValues11.Add(Convert.ToInt32(dr1["plt-costs-p07"]));
                hidValues11.Add(Convert.ToInt32(dr1["plt-costs-p08"]));
                hidValues11.Add(Convert.ToInt32(dr1["plt-costs-p09"]));
                hidValues11.Add(Convert.ToInt32(dr1["plt-costs-p10"]));
                hidValues11.Add(Convert.ToInt32(dr1["plt-costs-p11"]));
                hidValues11.Add(Convert.ToInt32(dr1["plt-costs-p12"]));
                yValues = hidValues11.ToArray(typeof(object)) as object[];
                series.Add(new Serie { name = dr1["plt-work-type-desc"].ToString(), data = yValues });
            }

            //Title
            AreaChart1.Title = new Title("Plant Costs");

            //Define Axis
            AreaChart1.YAxis.Add(new YAxisItem { title = new Title("$") });
            AreaChart1.XAxis.Add(new XAxisItem { categories = hidXCategories11.ToArray(typeof(string)) as string[] });

            //Plot Options
            AreaChart1.PlotOptions = new Highchart.Core.PlotOptions.PlotOptionsArea { stacking = Highchart.Core.Stacking.normal, lineColor = "#ffffff", lineWidth = 1, fillOpacity = 0.45 };

            //Customise Tooltip
            AreaChart1.Tooltip = new ToolTip("this.series.name +': ' + this.x +': '+ this.y");

            //Customise Legend
            AreaChart1.Legend = new Legend
            {
                layout = Layout.vertical,
                borderWidth = 3,
                align = Align.right,
                y = 20,
                x = -20,
                verticalAlign = Highchart.Core.VerticalAlign.top,
                shadow = true,
                backgroundColor = "#e3e6be"
            };

            //Bind to Control
            AreaChart1.DataSource = series;
            AreaChart1.DataBind();

            //Add Event
            AreaChart1.Appearance = new Highchart.Core.Appearance.Appearance { events = new Highchart.Core.Events.ChartEvents { addSeries = "this.chart.redraw();" } };
            AreaChart1.Dispose();