VueUiXy
Add config options to customize time labels in:
- tooltip
- time tag
- zoom labels
Especially useful when datetimeFormatter is enabled, to show a precise date inside these labels, which would otherwise have the same format as the time labels on the x axis.
This is a non-breaking change.
tooltip
const config = ref({
chart: {
tooltip: {
useDefaultTimeFormat: true, // default, same behavior as before
timeFormat: 'yyyy-MM-dd HH:mm:ss' // when datetimeFormatter is enabled and useDefaultTimeFormat is false
}
}
})time tag
const config = ref({
chart: {
timeTag: {
show: true, // false by default
useDefaultFormat: true, // default, same behavior as before
timeFormat: 'yyyy-MM-dd HH:mm:ss' // when datetimeFormatter is enabled and useDefaulFormat is false
// customFormat works exactly as for the tooltip. null by default, pass a callback which returns a string to enable. Will override timeFormat
customFormat: ({ absoluteIndex }) => {
return String(absoluteIndex);
}
}
}
})zoom labels
const config = ref({
chart: {
zoom: {
useDefaultFormat: true, // default, same behavior as before
timeFormat: 'yyyy-MM-dd HH:mm:ss' // when datetimeFormatter is enabled and useDefaulFormat is false
// customFormat works exactly as for the tooltip. null by default, pass a callback which returns a string to enable. Will override timeFormat
customFormat: ({ absoluteIndex }) => {
return String(absoluteIndex);
}
}
}
})Documentation website is up to date
If you just realized this is version 3 now, here are all the details.