Features

EquiVolume

EquiVolume

EquiVolume charts are similar to Candlestick charts, but they only show the high and low values.

Features

Chart Types
Interaction
Analytics

Description

EquiVolume charts are similar to Candlestick charts, but they only show the high and low values.

In addition, the width of each bar is determined by a fifth value, volume.

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 EquiVolume()
        {
            var model = BoxData.GetDataFromJson();
            ViewBag.DemoSettingsModel = new ClientSettingsModel() { };
            ViewBag.ChartType = C1.Web.Mvc.Finance.ChartType.EquiVolume;
            return View(model);
        }
    }
}
@using FinancialChartExplorer.Models

@model List<FinanceData>
@{
    ViewBag.DemoSettings = false;
    C1.Web.Mvc.Finance.ChartType chartType = ViewBag.ChartType;
    ClientSettingsModel demoSettingsModel = ViewBag.DemoSettingsModel;
}


<script type="text/javascript">
    c1.documentReady(function () {
        c1.getExtender(wijmo.Control.getControl("#rs"), "RangeSelector").min = 69.5;
    });
</script>


@(Html.C1().FinancialChart()
.Id(demoSettingsModel.ControlId)
.Bind(Model)
.BindingX("X")
.ChartType(chartType)
.Series(sers =>
    {
        sers.Add().Binding("High,Low,Open,Close,Volume").Name("BOX");
    })
.Tooltip(t => t.Content("financialTooltip")))

@Html.Partial("_RangeSelector")

@section Description{
    <p>@Html.Raw(Resources.Home.EquiVolume_Text0)</p>
    <p>@Html.Raw(Resources.Home.EquiVolume_Text1)</p>
}
@section Summary{
    <p>@Html.Raw(Resources.Home.EquiVolume_Text2)</p>
}