/// <reference path="JsChart-vsdoc.js" />

var Charting = MindFusion.Charting;

var Controls = Charting.Controls;

var Collections = MindFusion.Common.Collections;

var Drawing = MindFusion.Drawing;

var chartEl = document.getElementById('chart');

chartEl.width = chartEl.offsetParent.clientWidth;

chartEl.height = chartEl.offsetParent.clientHeight;

var chart = new Controls.AreaChart(chartEl);

// create sample data

var data = new Collections.ObservableCollection();

var years = new Collections.List();

var dt = new Date(new Date().getFullYear() - 10, 11, 31);

for (; ; )

{

if (dt.getFullYear() > new Date().getFullYear())

break;

years.add(new Date(dt.setFullYear(dt.getFullYear() + 1)));

}

var income = new Collections.List([12, 13.2, 15.6, 17.8, 39, 20, 29, 79, 101, 120, 122]);

var series = new Charting.DateTimeSeries(

years, income, years.item(0), years.item(years.count() - 1));

series.minValue = 0;

series.maxValue = 1;

series.dateTimeFormat = Charting.DateTimeFormat.CustomDateTime;

series.customDateTimeFormat = '{"year":"numeric"}';

data.add(series);

// setup the chart

chart.series = data;

chart.title = "Acme Inc. financial report";

chart.showXCoordinates = false;

chart.showLegend = false;

chart.layoutPanel.margin = new Charting.Margins(0, 0, 20, 0);

chart.areaOpacity = 0.7;

chart.xAxis.title = "";

chart.xAxis.minValue = 0;

chart.xAxis.maxValue = 1;

chart.xAxis.interval = 0.1;

chart.gridType = Charting.GridType.Horizontal;

chart.theme.gridLineColor = Drawing.Color.fromArgb(192, 192, 192);

chart.theme.gridLineStyle = Drawing.DashStyle.Dash;

chart.theme.gridColor1 = Drawing.Color.fromArgb(255, 255, 255);

chart.theme.gridColor2 = Drawing.Color.fromArgb(255, 255, 255);

chart.theme.axisTitleFontSize = 14;

chart.theme.dataLabelsFontSize = chart.theme.axisLabelsFontSize = 12;

chart.theme.titleFontSize = 20;

chart.chartPanel.margin = new Charting.Margins(5, 0, 0, 5);

chart.yAxis.title = "Income ($ in millions)";

chart.theme.uniformSeriesFill = new Drawing.Brush("#ffa000");

chart.theme.uniformSeriesStroke = new Drawing.Brush("#ff8f00");

chart.draw();