Skip to main content

Timezones

DXcharts provides an API to manage and configure the chart's timezone using the TimeZoneModel.

The model includes methods to get the current timezone offset, set a new timezone, and observe timezone changes:

export const getTimeZoneOffset = (chart: Chart, timezone: string) => {
    return chart.timeZoneModel.tzOffset(timezone);
}
export const setTimeZone = (chart: Chart, timezone: string) => {
    chart.timeZoneModel.setTimeZone(timezone);
}
export const observeTimeZoneChanged = (chart: Chart) => {
    return chart.timeZoneModel.observeTimeZoneChanged();
}

Get timezone offset​

To get the timezone offset value in milliseconds:

export const getTimeZoneOffset = (chart: Chart, timezone: string) => {
    return chart.timeZoneModel.tzOffset(timezone);
}

Set timezone​

To change the chart's timezone, use:

export const setTimeZone = (chart: Chart, timezone: string) => {
    chart.timeZoneModel.setTimeZone(timezone);
}

Observe timezone changes​

Use this method to execute a callback when the timezone changes:

export const observeTimeZoneChanged = (chart: Chart) => {
    return chart.timeZoneModel.observeTimeZoneChanged();
}

🔸 Custom date and time formatting​

You can override date and time formatting using the initFormatterFactory function, which accepts a custom DateFormatter object.

By default, formatting is based on the dateFormatter property in the chart configuration.

Further reading​