// // GET: /HighChartsSampleModel/ public ActionResult Index() { var highchartSample = new List<HighChartsSampleModel> { new HighChartsSampleModel() {Parameters = "Event", GoodScore = 23.45D, AverageScore = 15.32D,BadScore = 9.4D,ActualScore=78.33D}, new HighChartsSampleModel() {Parameters = "Weather",GoodScore=45.67D,AverageScore = 33.24D,BadScore = 12.23D,ActualScore = 56.22D}, new HighChartsSampleModel() {Parameters = "User Review",GoodScore=67.23D,AverageScore = 31.23D,BadScore = 10.11D,ActualScore = 29.44D}, new HighChartsSampleModel() {Parameters = "Tweets",GoodScore = 89.67D,AverageScore = 12.33D,BadScore = 3.43D,ActualScore = 88.11D}, new HighChartsSampleModel() {Parameters = "Persona",GoodScore=38.34D,AverageScore = 25.34D,BadScore = 16.43D,ActualScore = 35.08D}, new HighChartsSampleModel() {Parameters = "Crime",GoodScore=38.34D,AverageScore = 25.34D,BadScore = 16.43D,ActualScore = 24.87D} }; var xDataParameters = highchartSample.Select(i => i.Parameters).ToArray(); var actualScore = highchartSample.Select(i => i.ActualScore); var chart = new Highcharts("chart"); chart.InitChart(new Chart { DefaultSeriesType = ChartTypes.Bar }); chart.SetTitle(new Title { Text = "Risk Score Profiling" }); chart.SetSubtitle(new Subtitle { Text = "Risk predicting using social media" }); chart.SetXAxis(new XAxis { Categories = xDataParameters }); chart.SetYAxis(new YAxis { Title = new YAxisTitle { Text = "Scores" }, Max = 100 }); chart.SetLegend(new Legend { Enabled = false, }); chart.SetTooltip(new Tooltip { Enabled = true, Formatter = @"function(){return '<b>' + this.series.name +'</b><br/>' + this.x+':' + this.y;}" }); chart.SetPlotOptions(new PlotOptions { //Series = new PlotOptionsSeries() { Stacking = Stackings.Normal }, Bar = new PlotOptionsBar { DataLabels = new PlotOptionsBarDataLabels { Enabled = true,Color = Color.Maroon,Shadow = true}, //PointWidth = 10, //GroupPadding = 1, //PointPadding = 0, Shadow = true, BorderWidth = 1, BorderColor = Color.FloralWhite, } }); Data data = new Data( actualScore.Select(y => new Point { Color = GetBarColor(y), Y = y}).ToArray() ); chart.SetSeries(new Series { Name = "Actual Score", Data = data }); return View(chart); }
public static Highcharts ColumnChart(string chartTitle, string yAxisDescriptions, string[] categories, Object[][] categoriesNumbers, Number width, Number height, string mouseHoverDescription, string fakeChartName, string chartSubtitle) { var chart = new Highcharts(fakeChartName) .InitChart(new Chart { DefaultSeriesType = ChartTypes.Column, Margin = new[] { 50, 50, 100, 80 }, Width = width, Height = height }) .SetTitle(new Title { Text = chartTitle }) .SetXAxis(new XAxis { Categories = categories, Labels = new XAxisLabels { Rotation = -45, Align = HorizontalAligns.Right, Style = "background: '#ffffff',fontSize: '13px',fontFamily: 'Verdana, sans-serif'" }, }) .SetYAxis(new YAxis { Min = 0, Title = new YAxisTitle { Text = yAxisDescriptions, Style = "background: '#ffffff',fontSize: '13px',fontFamily: 'Verdana, sans-serif'", } }) .SetLegend(new Legend { Enabled = false }) .SetTooltip(new Tooltip { Enabled = true, FollowPointer = true, Formatter = @"function() { return '<span style=""color: '+this.series.color+'"">' + '" + mouseHoverDescription + @"' + '</span> <b> '+ this.y +'</b>'; }" }) .SetSeries(new Series { Data = new Data(categoriesNumbers ?? new object[] { }) }) .SetCredits(new Credits() { Enabled = false }); if (!string.IsNullOrEmpty(chartSubtitle)) { chart .SetSubtitle(new Subtitle() { Style = "color: '#ff0000'", Text = chartSubtitle }); } return chart; }
public static Highcharts StackColumnChart(string chartTitle, Number width, Number height, string[] categories, string yLabel, Series[] seriesData, string fakeChartName, string chartSubtitle, string tooltipFormatter) { var chart = new Highcharts(fakeChartName.Replace(" ", "")) .InitChart(new Chart { DefaultSeriesType = ChartTypes.Column, Width = width, Height = height }) .SetTitle(new Title { Text = chartTitle }) .SetXAxis(new XAxis { Categories = categories }) .SetYAxis(new YAxis { Min = 0, Title = new YAxisTitle { Text = yLabel, Style = "background: '#ffffff',fontSize: '13px',fontFamily: 'Verdana, sans-serif'" }, StackLabels = new YAxisStackLabels { Enabled = true }, }) .SetLegend(new Legend { BorderWidth = 0 }) .SetTooltip(new Tooltip { Enabled = true, FollowPointer = true, Formatter = tooltipFormatter }) .SetPlotOptions(new PlotOptions { Column = new PlotOptionsColumn { Stacking = Stackings.Normal, DataLabels = new PlotOptionsColumnDataLabels { Enabled = false } } }) .SetSeries(seriesData ?? new Series[] { }) .SetCredits(new Credits { Enabled = false }); if (!string.IsNullOrEmpty(chartSubtitle)) { chart .SetSubtitle(new Subtitle { Style = "color: '#ff0000'", Text = chartSubtitle }); } return chart; }
// FakeChartName should be unique for each chart on page, and best solution is to provide name without white spaces (e.g. chart1, chartN) public static Highcharts PieChart(string chartTitle, List<object[]> data, Number width, Number height, string fakeChartName, string chartSubtitle) { //remove data with 0 values if (data != null && data.Count > 0) data = data.Where(x => Convert.ToInt32(x[1]) != 0).ToList(); var dataArray = data.ToArray(); var chart = new Highcharts(fakeChartName) .InitChart(new Chart { PlotBackgroundColor = null, PlotBorderWidth = null, PlotShadow = false, Width = width, Height = height }) .SetTitle(new Title { Text = chartTitle }) .SetTooltip(new Tooltip { Formatter = "function() {return Math.round(this.percentage) + ' %' ; }" }) .SetPlotOptions(new PlotOptions { Pie = new PlotOptionsPie { AllowPointSelect = true, Cursor = Cursors.Pointer, DataLabels = new PlotOptionsPieDataLabels { Enabled = true, Color = ColorTranslator.FromHtml("#000000"), ConnectorColor = ColorTranslator.FromHtml("#000000"), Formatter = "function() { return Math.round(this.percentage) +' %'; }", Style = "fontSize: '13px',fontFamily: 'Verdana, sans-serif'" }, ShowInLegend = true } }) .SetSeries(new Series { Type = ChartTypes.Pie, Data = new Data(dataArray ?? new object[] { }) }) .SetCredits(new Credits { Enabled = false }); if (!string.IsNullOrEmpty(chartSubtitle)) { chart .SetSubtitle(new Subtitle { Style = "color: '#ff0000'", Text = chartSubtitle }); } return chart; }
public static Highcharts LineChart(string chartTitle, Number width, Number height, string[] categories, Series[] series, string fakeChartName, string yAxisDescriptions, string chartSubtitle, string pointFormatter, string plotOptionsLineMarker) { var chart = new Highcharts(fakeChartName.Replace(" ", "")) .InitChart(new Chart { Width = width, Height = height, DefaultSeriesType = ChartTypes.Line, }) .SetTitle(new Title { Text = chartTitle }) .SetXAxis(new XAxis { Categories = categories, Labels = new XAxisLabels { Style = "background: '#ffffff'", Enabled = true, Align = HorizontalAligns.Center } }) .SetYAxis(new YAxis { Title = new YAxisTitle { Text = yAxisDescriptions, Style = "background: '#ffffff'" } }) .SetPlotOptions(new PlotOptions { Series = new PlotOptionsSeries { DataLabels = new PlotOptionsSeriesDataLabels { Enabled = false, Style = "background: '#ffffff'", Formatter = @"function() { return '<span style=""font-size:10px; font-family:Calibri"">' + this.y + '</span>' ;}" } } }) .SetTooltip(new Tooltip { PointFormat = pointFormatter, Enabled = true, FollowPointer = true, Shared = true, HeaderFormat = "", Crosshairs = new Crosshairs(true) }) .SetLegend(new Legend { BorderWidth = 0 }) .SetSeries(series ?? new Series[] { }) .SetCredits(new Credits { Enabled = false }); if (!string.IsNullOrEmpty(chartSubtitle)) { chart .SetSubtitle(new Subtitle { Style = "color: '#ff0000'", Text = chartSubtitle }); } if (!string.IsNullOrEmpty(plotOptionsLineMarker)) { chart.SetPlotOptions(new PlotOptions { Line = new PlotOptionsLine { Marker = new PlotOptionsLineMarker { Symbol = plotOptionsLineMarker, Enabled = true } } }); } return chart; }
public ActionResult Contact() { ViewBag.Message = "Your contact page."; var lists = new List<HomeModel>{ new HomeModel(){ Date = new DateTime(2015, 08, 10), Weight = 232.8 }, new HomeModel(){ Date = new DateTime(2015, 08, 11), Weight = 232.6 }, new HomeModel(){ Date = new DateTime(2015, 08, 12), Weight = 233 }, new HomeModel(){ Date = new DateTime(2015, 08, 13), Weight = 232.8 }, new HomeModel(){ Date = new DateTime(2015, 08, 14), Weight = 233.4 }, new HomeModel(){ Date = new DateTime(2015, 08, 15), Weight = 233 }, new HomeModel(){ Date = new DateTime(2015, 08, 16), Weight = 233 }, new HomeModel(){ Date = new DateTime(2015, 08, 17), Weight = 232.8 }, new HomeModel(){ Date = new DateTime(2015, 08, 18), Weight = 231.2 }, new HomeModel(){ Date = new DateTime(2015, 08, 19), Weight = 231.8 }, new HomeModel(){ Date = new DateTime(2015, 08, 20), Weight = 230.8 }, new HomeModel(){ Date = new DateTime(2015, 08, 21), Weight = 231.8 }, new HomeModel(){ Date = new DateTime(2015, 08, 22), Weight = 231 }, new HomeModel(){ Date = new DateTime(2015, 08, 23), Weight = 230.2 }, new HomeModel(){ Date = new DateTime(2015, 08, 24), Weight = 232.2 }, new HomeModel(){ Date = new DateTime(2015, 08, 25), Weight = 232 }, new HomeModel(){ Date = new DateTime(2015, 08, 26), Weight = 231.6 }, new HomeModel(){ Date = new DateTime(2015, 08, 27), Weight = 230 }, new HomeModel(){ Date = new DateTime(2015, 08, 28), Weight = 230 }, new HomeModel(){ Date = new DateTime(2015, 08, 29), Weight = 231.4 }, new HomeModel(){ Date = new DateTime(2015, 08, 30), Weight = 231.8 }, new HomeModel(){ Date = new DateTime(2015, 08, 31), Weight = 230.6 }, new HomeModel(){ Date = new DateTime(2015, 09, 01), Weight = 230.4 }, new HomeModel(){ Date = new DateTime(2015, 09, 02), Weight = 229.2 }, new HomeModel(){ Date = new DateTime(2015, 09, 03), Weight = 229.8 }, new HomeModel(){ Date = new DateTime(2015, 09, 04), Weight = 230 }, new HomeModel(){ Date = new DateTime(2015, 09, 05), Weight = 229.4 }, new HomeModel(){ Date = new DateTime(2015, 09, 06), Weight = 230.2 }, new HomeModel(){ Date = new DateTime(2015, 09, 07), Weight = 229.4 }, new HomeModel(){ Date = new DateTime(2015, 09, 08), Weight = 228.8 } }; var xDataDate = lists.Select(x => x.Date).ToArray(); string[] xDate = xDataDate.Select(x => x.ToString("yyyy/MM/dd")).ToArray(); var yDataWeight = lists.Select(x => new object[] { x.Weight }).ToArray(); var chart = new Highcharts("charts"); chart.InitChart(new Chart { DefaultSeriesType = ChartTypes.Line }); chart.SetTitle(new Title { Text = "Weight for last month" }); chart.SetSubtitle(new Subtitle { Text = "August 8 - September 8" }); chart.SetXAxis(new XAxis { Categories = xDate }); chart.SetYAxis(new YAxis { Title = new YAxisTitle { Text = "Weight in lbs" } }) .SetTooltip(new Tooltip { Enabled = true, Formatter = @"function() { return '<b>' + this.series.name + '</b><br/>' + this.x +': ' + this.y; }" }) .SetPlotOptions(new PlotOptions { Line = new PlotOptionsLine { DataLabels = new PlotOptionsLineDataLabels { Enabled = true }, EnableMouseTracking = false } }) .SetSeries(new[] { new Series{ Name = "Date", Data = new Data(yDataWeight)}, }); return View(chart); }
public string WeightYearProgressNet() { var startWeight = pedometerCalcService.GetStartWeight(DateTime.Now.Year); const int goalWeight = 144; var currentWeight = pedometerCalcService.GetRecentWeight(); var goalLoss = startWeight - goalWeight; var actualLoss = Math.Round(startWeight - currentWeight, 1); var expectedPct = (DateTime.Now.DayOfYear / 365.0); var expectedLoss = Math.Round(expectedPct * goalLoss, 1); var highchart = new Highcharts("weightloss"); var chart = new Chart() { Type = ChartTypes.Gauge }; highchart.InitChart(chart); highchart.SetTitle(new Title{Text = "Weight Loss " + Math.Round(currentWeight,1)}); var series = new Series {Data = new Data(new object[] {actualLoss})}; highchart.SetSeries(series); var pane = new Pane { Background = new[] { new BackgroundObject { InnerRadius = new PercentageOrPixel(60, true), OuterRadius = new PercentageOrPixel(100, true) } }, StartAngle = 0, EndAngle = 360 }; highchart.SetPane(pane); var yaxis = new YAxis { Min = 0, Max = goalLoss, PlotBands = new[] { new YAxisPlotBands { From = 0, To = expectedLoss, Color = Color.Red }, new YAxisPlotBands { From = expectedLoss, To = expectedLoss+0.7, Color = Color.Yellow }, new YAxisPlotBands { From = expectedLoss+0.7, To = goalLoss, Color = Color.Green } }, Labels = new YAxisLabels() { Style = "color:'black'"} }; highchart.SetYAxis(yaxis); highchart.SetTooltip(new Tooltip() {Enabled = false}); highchart.SetSubtitle(new Subtitle() { Text = string.Format("Actual: {0} | Expected: {1} | Difference: {2}", actualLoss, expectedLoss, actualLoss-expectedLoss) }); highchart.SetLegend(new Legend() {Enabled = false}); return highchart.ToHtmlString(); }
public Highcharts GrafickOf10TopClients() { Highcharts chart = new Highcharts("OrdersReport"); chart.SetTitle(new Title() { Text = Resources.Resource.OrderStatisticMax }); chart.SetSubtitle(new Subtitle() { Text = Resources.Resource.To10ClientsMax }); chart.SetYAxis(new YAxis() { Title = new YAxisTitle() { Text = Resources.Resource.OrderIncomeMax } }); chart.SetXAxis(new XAxis() { Title = new XAxisTitle() { Text = Resources.Resource.AmountOfOrdersMax } }); List<Series> series = new List<Series>(); List<object[]> data = new List<object[]>(); /*foreach (var client in orderManager.GetTop10()) { Series serie = serie = new Series(); serie.Type = ChartTypes.Column; serie.Name = client.Select(x => x.Person.FirstName).First(); ; data.Clear(); data.Add(new object[] { client.Count(), client.Sum(x => x.TotalPrice) }); serie.Data = new Data(data.ToArray()); series.Add(serie); } chart.SetSeries(series.ToArray()); chart.SetLegend(new Legend() { Align = HorizontalAligns.Right, Layout = Layouts.Vertical, VerticalAlign = VerticalAligns.Top });*/ return chart; }