chartjs / chartjs/Chart.js

Wrong bar width with multiple x-Axis

Open
#12,262 0 comments 0 reactions 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

If we create a bar chart that has both a bar dataset and a line dataset (both on different axis), the bars should take the full width of the scale tick.

### Current behavior

The bars only take half of the available space when we add a line dataset, even though the line has no impact on the available space for the bars.

Image

### Reproducible sample

https://codepen.io/Adrien-Minne/pen/azBYbYw?editors=0010

### Optional extra steps/info to reproduce

Issue is present since version 4.5, specifically with this commit: https://github.com/chartjs/Chart.js/commit/8ea47cad19ec894319f74fde340e8bc8d79fc370. Previous versions didn't have this issue.

### Possible solution

Commit https://github.com/chartjs/Chart.js/commit/8ea47cad19ec894319f74fde340e8bc8d79fc370 divide the available space by the number of axis, but it should only consider the axis that contains bar datasets.

### Context

_No response_

### chart.js version

4.5.1

### Browser name and version

Chrome Version 148.0.7778.167 (Official Build) (64-bit)

### 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.