Search results

DateTime,Numeric and Logarithmic Axis

DateTime Axis

Date time axis uses date time scale and displays the date time values as axis labels in the specified format and set the valueType of axis to DateTime.

tagHelper
datetime.cs
<ejs-stockchart id="stockchart" load="stockload" title="AAPL Stock Price">
                <e-stockchart-series-collection>
                    <e-stockchart-series type='Candle' xName="x"> </e-stockchart-series>
                </e-stockchart-series-collection>
                <e-stockchart-primaryxaxis valueType="DateTime">
                </e-stockchart-primaryxaxis>
            </ejs-stockchart>

    <script src="~/financial-data.js"></script>
    
    <script>
        var data = chartData;
            function stockload(args) {
                args.stockChart.series[0].dataSource = data;
              }
    </script>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;

namespace EJ2CoreSampleBrowser.Controllers.StockChart
{
    public partial class StockChartController : Controller
    {
        public IActionResult Default()
        {
            return View();
        }
    }
}

Logarithmic Axis

Logarithmic axis uses logarithmic scale and it is very useful in visualizing data, when it has numerical values in both lower order of magnitude (eg: 10-6) and higher order of magnitude (eg: 106) and set the valueType of axis to Lograthmic.

tagHelper
log.cs
<ejs-stockchart id="stockchart" load="stockload" title="AAPL Stock Price">
                <e-stockchart-series-collection>
                    <e-stockchart-series type='Candle' xName="x" yName="volume"> </e-stockchart-series>
                </e-stockchart-series-collection>
                 <e-stockchart-primaryxaxis valueType="DateTime">
                </e-stockchart-primaryxaxis>
                <e-stockchart-primaryyaxis valueType="Logarithmic"></e-stockchart-primaryyaxis>
            </ejs-stockchart>

    <script src="~/financial-data.js"></script>
    
    <script>
        var data = chartData;
            function stockload(args) {
                args.stockChart.series[0].dataSource = data;
               }
    </script>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;

namespace EJ2CoreSampleBrowser.Controllers.StockChart
{
    public partial class StockChartController : Controller
    {
        public IActionResult Default()
        {
            return View();
        }
    }
}

See Also