Skip to main content

ScaleTime

Namespace: Wisej.Web.Ext.ChartJS

Assembly: Wisej.Web.Ext.ChartJS (4.1.0.0)

Options used when the axis is a time scale.

public class ScaleTime : OptionsBase

An instance of this class is exposed by the Time property of each axis in xAxes and yAxes and maps to the time configuration of the Chart.js axis. The options are serialized only when the axis Type is Time. Chart.js uses the Moment.js library to parse and format the dates.

Example:

var xAxis = this.chartJS1.Options.Scales.xAxes[0];
xAxis.Type = ScaleType.Time;
xAxis.Time.Unit = TimeScaleTimeUnit.day;
xAxis.Time.TooltipFormat = "MMM D, YYYY";

Constructors​

Instance member ScaleTime()​

Constructs a new instance.

Creates a set of time scale options that is not yet attached to an owner.

Example:

var time = new ScaleTime();
time.Unit = TimeScaleTimeUnit.month;
this.chartJS1.Options.Scales.xAxes[0].Type = ScaleType.Time;
this.chartJS1.Options.Scales.xAxes[0].Time = time;

Instance member ScaleTime(owner)​

Constructs a new instance of the ScaleTime set.

NameTypeDescription
ownerOptionsBaseThe OptionsBase instance (usually the axis options) that owns this set of options.

Throws:

Example:

var xAxis = this.chartJS1.Options.Scales.xAxes[0];
var time = new ScaleTime(xAxis);
time.Unit = TimeScaleTimeUnit.week;
xAxis.Time = time;

Properties​

Instance member DisplayFormats​

Object: Returns or sets how the different time units are formatted on the axis ticks. (Default: null)

Value: An object whose property names are the time units (i.e. day, month) and values are Moment.js format strings; null (default) uses the Chart.js defaults.

The object is serialized as-is to the time.displayFormats option of Chart.js; an anonymous type is the simplest way to specify it.

Example:

var time = this.chartJS1.Options.Scales.xAxes[0].Time;
time.DisplayFormats = new
{
	day = "DD/MM",
	month = "MMM YY"
};

Instance member Parser​

String: Returns or sets a custom format to be used by Moment.js to parse the dates. (Default: "")

Value: A Moment.js format string. The default is an empty string, which lets Moment.js detect the format.

Use it when the data values are strings in a format that Moment.js cannot recognize automatically.

Example:

var xAxis = this.chartJS1.Options.Scales.xAxes[0];
xAxis.Type = ScaleType.Time;
xAxis.Time.Parser = "DD/MM/YYYY";
this.chartJS1.Labels = new[] { "01/03/2024", "02/03/2024", "03/03/2024" };

Instance member Round​

Nullable<TimeScaleTimeUnit>: Returns or sets the unit to which the dates are rounded (to the start of the unit). (Default: null)

Value: One of the TimeScaleTimeUnit values, or null (default) to disable rounding.

Example:

// round all the timestamps to the start of the hour.
this.chartJS1.Options.Scales.xAxes[0].Type = ScaleType.Time;
this.chartJS1.Options.Scales.xAxes[0].Time.Round = TimeScaleTimeUnit.hour;

Instance member TooltipFormat​

String: Returns or sets the Moment.js format string used to display the dates in the tooltips. (Default: "")

Value: A Moment.js format string. The default is an empty string, which uses the Chart.js default.

See https://momentjs.com/docs/#/displaying/format/ for the format tokens.

Example:

this.chartJS1.Options.Scales.xAxes[0].Type = ScaleType.Time;
this.chartJS1.Options.Scales.xAxes[0].Time.TooltipFormat = "ddd, MMM D YYYY h:mm a";

Instance member Unit​

Nullable<TimeScaleTimeUnit>: Returns or sets the time unit used for the ticks of the scale. (Default: null)

Value: One of the TimeScaleTimeUnit values, or null (default) to let Chart.js determine the most appropriate unit from the data.

Example:

var xAxis = this.chartJS1.Options.Scales.xAxes[0];
xAxis.Type = ScaleType.Time;
xAxis.Time.Unit = TimeScaleTimeUnit.month;

Instance member UnitStepSize​

Int32: Returns or sets the number of units between grid lines. (Default: 1)

Value: The default is 1.

Maps to the time.unitStepSize option of Chart.js.

Example:

// a tick every 15 minutes.
var time = this.chartJS1.Options.Scales.xAxes[0].Time;
time.Unit = TimeScaleTimeUnit.minute;
time.UnitStepSize = 15;