FinancialChart - Trend Lines

Features

Trend Lines

Trend lines are used to visualize trends in data and to help analyze the problems of prediction.

Features

Chart Types

Interaction

Analytics

Sample
Source
Documentation

Settings

Description

Trend lines are used to visualize trends in data and to help analyze the problems of prediction.

TrendLineController.cs
TrendLine.cshtml

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using FinancialChartExplorer.Models;
 
namespace FinancialChartExplorer.Controllers
{
    public partial class HomeController : Controller
    {
        public ActionResult TrendLine()
        {
            var model = BoxData.GetDataFromJson();
            ViewBag.DemoSettingsModel = new ClientSettingsModel() { Settings = CreateTrendLineSettings() };
            return View(model);
        }
 
        private static IDictionary<string, object[]> CreateTrendLineSettings()
        {
            var settings = new Dictionary<string, object[]>
            {
                {"Order", new object[]{"2","3","4","5","6","7","8","9"}},
                {"SampleCount", new object[]{"100","120","140","160","180","200"}},
                {"FitType", new object[]{"Linear","AverageX","AverageY","Exponential","Fourier","MaxX","MaxY","MinX","MinY","Polynomial"}},
            };
 
            return settings;
        }
    }
}

@using FinancialChartExplorer.Models
 
@model List<FinanceData>
@{
    ViewBag.DemoSettings = true;
    ClientSettingsModel demoSettingsModel = ViewBag.DemoSettingsModel;
}
 
 
<script type="text/javascript">
    function customChangeOrder(control, value) {
        var trendLine = control.series[1];
        if (trendLine) {
            trendLine.order = +value;
        }
    }
 
    function customChangeSampleCount(control, value) {
        var trendLine = control.series[1];
        if (trendLine) {
            trendLine.sampleCount = +value;
        }
    }
 
    function customChangeFitType(control, value) {
        var trendLine = control.series[1];
        if (trendLine) {
            trendLine.fitType = wijmo.chart.analytics.TrendLineFitType[value];
        }
    }
 
</script>
 
 
@(Html.C1().FinancialChart()
.Id(demoSettingsModel.ControlId)
.Bind(Model)
.BindingX("X")
.ChartType(C1.Web.Mvc.Finance.ChartType.Line)
.Series(sers =>
    {
        sers.Add().Binding("Close").Name("BOX");
        sers.AddTrendLine().Binding("Close").FitType(C1.Web.Mvc.Chart.TrendLineFitType.Linear).Name("Trend Line");
    })
.Tooltip(t => t.Content("tooltip")))
 
 
@section Description{
    <p>
        Trend lines are used to visualize trends in data and to help analyze the problems of prediction.
    </p>
}
@section Summary{
    <p>
        Trend lines are used to visualize trends in data and to help analyze the problems of prediction.
    </p>
}