TimeLabelConfig

Example

{
  color: '#555',
  fontFamily: 'Arial',
  fontSize: 12,
  fontWeight: 'normal',
  fontVariant: 'normal',
  fontStyle: 'normal',
  top: 8,
  formatter: ({ utcTs, timeUnit, kind, timeZoneId }) => {
    const date = new Date(utcTs);
    return date.toLocaleString();
  }
}

Properties

Base Props

LabelConfig

top

• Type: number
• Default: 8

Offset from the top of the x-axis in pixels.

formatter

• Type: TimeLabelFormatter
• Default: defaultTimeLabelFormatter.ts

Define a formatter function that returns a formatted date string for the time label.

TimeLabelFormatter

type TimeLabelFormatter = (args: TimeLabelFormatterArgs) => string;

TimeLabelFormatterArgs

utcTs

• Type: number

A UTC timestamp in milliseconds.

timeUnit

• Type: 'minute' | 'hour' | 'day' | 'week' | 'month' | 'year'

The current time unit of the chart's time axis.

kind

• Type: 'minor' | 'major'

Specifies whether the label is a minor or major time label.

timeZoneId

• Type: string | null

An optional IANA time zone identifier (e.g. 'America/New_York').

TypeScript

interface TimeLabelConfig extends LabelConfig {
  top?: number;
  formatter?: TimeLabelFormatter;
}

interface TimeLabelFormatterArgs {
  utcTs: number;
  timeUnit: TimeUnit;
  kind: TimeLabelKind;
  timeZoneId?: string | null;
}

type TimeLabelFormatter = (args: TimeLabelFormatterArgs) => string;

type TimeLabelKind = 'minor' | 'major';