Skip to content

Commit

Permalink
Types/Allow min-max as string timescale (#9985)
Browse files Browse the repository at this point in the history
* allow for string in time scale min max config

* add min-max type to docs

* typo
  • Loading branch information
LeeLenaleee committed Dec 14, 2021
1 parent 5bea389 commit 0a5c058
Show file tree
Hide file tree
Showing 2 changed files with 36 additions and 0 deletions.
34 changes: 34 additions & 0 deletions docs/axes/cartesian/time.md
Expand Up @@ -24,6 +24,8 @@ Namespace: `options.scales[scaleId]`

| Name | Type | Default | Description
| ---- | ---- | ------- | -----------
| `min` | `string`\|`number` | | The minimum item to display. [more...](#min-max-configuration)
| `max` | `string`\|`number` | | The maximum item to display. [more...](#min-max-configuration)
| `adapters.date` | `object` | `{}` | Options for adapter for external date library if that adapter needs or supports options
| `bounds` | `string` | `'data'` | Determines the scale bounds. [more...](./index.md#scale-bounds)
| `ticks.source` | `string` | `'auto'` | How ticks are generated. [more...](#ticks-source)
Expand Down Expand Up @@ -124,6 +126,38 @@ If this property is defined as a string, it is interpreted as a custom format to

If this is a function, it must return a type that can be handled by your date adapter's `parse` method.

## Min Max Configuration

For both the `min` and `max` properties, the value must be `string` that is parsable by your date adapter or a number with the amount of milliseconds that have elapsed since UNIX epoch.
In the example below the x axis will start at 7 October 2021.

```javascript
let chart = new Chart(ctx, {
type: 'line',
data: {
datasets: [{
data: [{
x: '2021-11-06 23:39:30',
y: 50
}, {
x: '2021-11-07 01:00:28',
y: 60
}, {
x: '2021-11-07 09:00:28',
y: 20
}]
}],
},
options: {
scales: {
x: {
min: '2021-11-07 00:00:00',
}
}
}
});
```

## Internal data format

Internally time scale uses milliseconds since epoch
2 changes: 2 additions & 0 deletions types/index.esm.d.ts
Expand Up @@ -3174,6 +3174,8 @@ export const LogarithmicScale: ChartComponent & {
};

export type TimeScaleOptions = CartesianScaleOptions & {
min: string | number;
max: string | number;
/**
* Scale boundary strategy (bypassed by min/max time options)
* - `data`: make sure data are fully visible, ticks outside are removed
Expand Down

0 comments on commit 0a5c058

Please sign in to comment.