using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Highsoft.Web.Mvc.Charts;


namespace MVC_Demo.Areas.Highcharts.Controllers.Shared
{
    public partial class SharedController : Controller
    {
        public ActionResult AreaStacked()
        {
            List<double?> asiaValues = new List<double?> { 502, 635, 809, 947, 1402, 3634, 5268 };
            List<double?> africaValues = new List<double?> { 106, 107, 111, 133, 221, 767, 1766 };
            List<double?> europeValues = new List<double?> { 163, 203, 276, 408, 547, 729, 628 };
            List<double?> americaValues = new List<double?> { 18, 31, 54, 156, 339, 818, 1201 };
            List<double?> oceaniaValues = new List<double?> { 2, 2, 2, 6, 13, 30, 46 };

            List<AreaSeriesData> asiaData = new List<AreaSeriesData>();
            List<AreaSeriesData> africaData = new List<AreaSeriesData>();
            List<AreaSeriesData> europeData = new List<AreaSeriesData>();
            List<AreaSeriesData> americaData = new List<AreaSeriesData>();
            List<AreaSeriesData> oceaniaData = new List<AreaSeriesData>();

            asiaValues.ForEach(p => asiaData.Add(new AreaSeriesData { Y = p }));
            africaValues.ForEach(p => africaData.Add(new AreaSeriesData { Y = p }));
            europeValues.ForEach(p => europeData.Add(new AreaSeriesData { Y = p }));
            americaValues.ForEach(p => americaData.Add(new AreaSeriesData { Y = p }));
            oceaniaValues.ForEach(p => oceaniaData.Add(new AreaSeriesData { Y = p }));

            ViewData["asiaData"] = asiaData;
            ViewData["africaData"] = africaData;
            ViewData["europeData"] = europeData;
            ViewData["americaData"] = americaData;
            ViewData["oceaniaData"] = oceaniaData;

            return View();
        }
    }
}

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

@using Highsoft.Web.Mvc.Charts
@using Highsoft.Web.Mvc.Charts.Rendering

<script type="text/javascript">

    function formatYAxis() {
        return this.value / 1000;
    }


</script>

@{var chartOptions = new Highcharts
    {
        Title = new Title
        {
            Text = "Historic and Estimated Worldwide Population Growth by Region"
        },
        Subtitle = new Subtitle
        {
            Text = "Source: Wikipedia.org"
        },
        XAxis = new List<XAxis>
    {
                new XAxis
                {
                    Categories = new List<string> { "1750", "1800", "1850", "1900", "1950", "1999", "2050" },
                    TickmarkPlacement = XAxisTickmarkPlacement.On
                }
            },
        YAxis = new List<YAxis>
    {
            new YAxis
                {
                    Title = new YAxisTitle
                    {
                        Text = "Billions"
                    },
                    Labels = new YAxisLabels
                    {
                        Formatter = "formatYAxis"
                    }
                }
            },
        Tooltip = new Tooltip
        {
            Shared = true,
            ValueSuffix = " millions"
        },
        PlotOptions = new PlotOptions
        {
            Area = new PlotOptionsArea
            {
                Stacking = PlotOptionsAreaStacking.Normal,
                LineColor = "#666666",
                LineWidth = 1,
                Marker = new PlotOptionsAreaMarker
                {
                    LineWidth = 1,
                    LineColor = "#666666"
                }
            }
        },
        Series = new List<Series>
    {
                new AreaSeries
                {
                    Name = "Asia",
                    Data = @ViewData["asiaData"] as List<AreaSeriesData>
                },
                new AreaSeries
                {
                    Name = "Africa",
                    Data = @ViewData["africaData"] as List<AreaSeriesData>
                },
                new AreaSeries
                {
                    Name = "Europe",
                    Data = @ViewData["europeData"] as List<AreaSeriesData>
                },
                new AreaSeries
                {
                    Name = "America",
                    Data = @ViewData["americaData"] as List<AreaSeriesData>
                },
                new AreaSeries
                {
                    Name = "Oceania",
                    Data = @ViewData["oceaniaData"] as List<AreaSeriesData>
                }
            }
    };

    chartOptions.ID = "chart";
    var renderer = new HighchartsRenderer(chartOptions);
}

@Html.Raw(renderer.RenderHtml())