Skip to content

spanGaps not working near min and max limits #11934

@marisst

Description

@marisst

Expected behavior

I show a line chart based on a dataset with a few null values.

labels: [0, 10, 20, 30, 40, 50, 60, 70, 80, 90, 100],
datasets: [{
    label: '# of Votes',
    data: [3, null, 2, 3, 2, 3, 5, 4, 3, null, 5],
    spanGaps: true,
    tension: 0.4
}]
Skjermbilde 2024-10-18 kl  15 34 35

I set a min and max limit for the x axis near the null values.

scales: {
    x: {
        type: 'linear',
        min: 11,
        max: 90,
    }
}
Skjermbilde 2024-10-18 kl  15 18 59

I expect the gaps to be spanned in the same way with or without the x scale limits.

Current behavior

Gaps are not spanned near min and max limits.
Skjermbilde 2024-10-18 kl  15 23 11

Reproducible sample

https://codepen.io/marisst/pen/GRVEyGK

Optional extra steps/info to reproduce

No response

Possible solution

No response

Context

This issue is very painful when creating zoomable and pannable charts with chartjs-plugin-zoom because the whole plug-in relies on scale min and max limits. However, the issue is not in the plugin itself, but in the core chart.js library.

Skjermopptak.2024-10-18.kl.15.51.15.mov

chart.js version

v4.4.5

Browser name and version

No response

Link to your project

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions