ComponentOne
Web API Explorer ASP.NET Web API Explorer

Wijmo5FlexChart

Financial Chart

Features

Settings

Export
Export Format :
Height :
Width :
Export Name :

Description

This sample demonstrates how to export a wijmo5 Financial FlexChart to image file.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using WebApiExplorer.Models;

namespace WebApiExplorer.Controllers
{
    public partial class Wijmo5FlexChartController : Controller
    {
        private readonly ClientSettingsModel _financialChartSettingsModel = new ClientSettingsModel
        {
            Settings = new Dictionary<string, object[]>
            {
                {"ChartType", new object[]{"Candlestick", "HighLowOpenClose"}}
            }
        };

        public ActionResult FinancialChart()
        {
            ViewBag.DemoSettingsModel = _financialChartSettingsModel;
            ViewBag.Options = _flexChartModel;
            return View();
        }
    }
}
@using WebApiExplorer.Models
@{
    ClientSettingsModel settings = ViewBag.DemoSettingsModel;
    ImageExportOptions optionsModel = ViewBag.Options;
    ViewBag.DemoSettings = true;
}

<div id="@(optionsModel.ControlId)" ></div>

@section Settings{
    @Html.Partial("_ImageExportOptions", optionsModel)
}

<script>
    var chart = new wijmo.chart.FlexChart('#@(optionsModel.ControlId)');

    chart.initialize({
        chartType: "Candlestick",
        itemsSource: [],
        bindingX: 'x',
        symbolSize: 6,
        series: [
            { binding: 'hi,lo,open,close' }
        ]
    });

    var start = new Date(99, 0, 1);
    for (var i = 0; i < 90; i++) {
        var q = {};

        q.x = new Date(99, 0, i);

        if (i > 0)
            q.open = chart.itemsSource[i - 1].close;
        else
            q.open = 1000;

        q.hi = q.open + Math.random() * 50;
        q.lo = q.open - Math.random() * 50;

        q.close = q.lo + Math.random() * (q.hi - q.lo);

        chart.itemsSource.push(q);
    }
</script>

@section Description{
    @Html.Raw(Resources.Wijmo5FlexChart.FinancialChart_Text0)
}