chartjs / chartjs/Chart.js

Single timeseries bar chart creates multiple ticks

Open
#11,545 0 comments 1 reaction 0 assignees View on GitHub
type: bug
Dominant language
JavaScript
Stars
67.7k
Forks
11.9k
Avg merge
7h 39m
Merged PRs (30d)
5

Description

### Expected behavior

Creating a timeseries based bar chart with only a single bar and setting the ticks source to `data` will result in two additional but undesired ticks (marked in red color) left and right to the single tick coming from the data itself:

![2023-10-16_12h20_02](https://github.com/chartjs/Chart.js/assets/7623375/ac9d8853-ae0f-4621-a68a-3f4db0faee3a)

The issue can be found in `_generate()` in this [commit](https://github.com/chartjs/Chart.js/commit/05608b0ceb13b49aec0fcefa4915c1e498fcb9ee#diff-f646705ee87e1da4be6cb4fca41e8322ba91e9db6f31ff76b2a868d9ff7f35e5). Here, `min` and `max` result in the additional ticks as they both have very small offset to the data itself (exactly 1 ms).

### Current behavior

See a sample here: [https://stackblitz.com/edit/js-vssd2m](https://stackblitz.com/edit/js-vssd2m). You'll immediately notice the effect:

1. The first chart shows a single bar with tree ticks.
2. The second chart shows two bars (or more) that no longer show the effect of undesired ticks.

### Reproducible sample

https://stackblitz.com/edit/js-vssd2m

### Optional extra steps/info to reproduce

_No response_

### Possible solution

See the `_generate()` function. `min` and `max` show a slight offset hence the `timestamps` array is extended with the additional ticks.

### Context

_No response_

### chart.js version

v4.4.0

### Browser name and version

Firefox v118

### Link to your project

_No response_

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.