SGP
SGP

Reputation: 404

How to disable animations on Highcharts Dotnet C# MVC?

So I have begun using Dotnet.Highcharts in Visual Studio with C# and MVC, Its quite different from its javascript counterpart, I need to use ghostjs to take a picture from my web page to send as a report, as many must know, this means that animations interfere with this working properly as bars show up to half of the height they should be.

I'm using the recommended coding from Dotnet.highcharts which mostly uses Razor to configure the chart.

I have tried disabling animations in all these places:

 PlotOptions = new PlotOptions
        {
            Column = new PlotOptionsColumn
            {
                PointPadding = 0.2,
                BorderWidth = 0,
                Animation = new Animation() { Enabled = false, Duration = 0 }
            },
            Series = new PlotOptionsSeries
            {
                Animation = new Animation() { Enabled = false, Duration = 0}
            }
        },
 chartOptions.Drilldown.Animation = new Animation() { Enabled = false, Duration = 0};
 chartOptions.Chart.Animation.Enabled = false;

and still the chart keeps animating, I just don't know what is going on

here is my full Razor code for the chart

var chartOptions = new Highcharts
    {

        Title = new Title { Text = "Transactions" },
        Subtitle = new Subtitle { Text = "December" },
        XAxis = new List<XAxis>
        {
            new XAxis
            {
                Categories = ViewBag.ListCategories

            }
        },
        YAxis = new List<YAxis>
        {
            new YAxis
            {
                Min = 0,
                Title = new YAxisTitle
                {
                    Text = "Tx"
                }
            }
        },
        Tooltip = new Tooltip
        {
            HeaderFormat = "<span style='font-size:10px'>{point.key}</span><table style='font-size:12px'>",
            PointFormat = "<tr><td style='color:{series.color};padding:0'>{series.name}: </td><td style='padding:0'><b>{point.y:.0f}</b></td></tr>",
            FooterFormat = "</table>",
            Shared = true,
            UseHTML = true
        },
        PlotOptions = new PlotOptions
        {
            Column = new PlotOptionsColumn
            {
                PointPadding = 0.2,
                BorderWidth = 0,
                Animation = new Animation() { Enabled = false, Duration = 0 }
            },
            Series = new PlotOptionsSeries
            {
                Animation = new Animation() { Enabled = false, Duration = 0}
            }
        },
        Series = new List<Series>
        {
         new ColumnSeries
         {
         Name = "TX",
        Data = ViewData["DataTX"] as List<ColumnSeriesData>
    }
      }

    };

    chartOptions.ID = "chart";
    chartOptions.Drilldown.Animation = new Animation() { Enabled = false, Duration = 0};
    chartOptions.Chart.Animation.Enabled = false;

    var renderer = new HighchartsRenderer(chartOptions);

Upvotes: 1

Views: 206

Answers (2)

BitQuestions
BitQuestions

Reputation: 760

This one worked for me. Had to play with it a while, seems there's no clear documentation.

DotNet.Highcharts.Highcharts chart = new DotNet.Highcharts.Highcharts("chart")
.InitChart(new Chart { DefaultSeriesType = ChartTypes.Areaspline})  
.SetTitle(new Title
{
Text = "myLabel",
X = -20
})      
        
.SetSeries(new[]
{
  new Series { Name = "MyUsers", Data = new Data(myData), PlotOptionsSeries=new PlotOptionsSeries(){Animation=new Animation(false)} }
});

Upvotes: 1

SGP
SGP

Reputation: 404

I found a way to disable the animation inside highcharts.js (From another question for the js version)

showCheckbox: !1, 
animation: { duration: 1E3 }
, events: {},

I changed 1E3 to 0 and it worked, however, this is not the optimal solution, there must be a way to achieve this the right way. The whole point of the highcharts dll for visual studio is the ability to use highcharts without touching javascript

For now, I won't accept my own answer as the answer

Upvotes: 0

Related Questions