[Bug] Bars overlap for multiple time series

[sainadh6414]

Description

I have 3 data sets to display, with overlapping timeseries on x axis. When I used c3.js the similar dataset was shown with bars side by side on x axis, like a stacked bar chart. After switching to billboad.js the bars start to overlap each other. Expectation is that, similar timestamped data should be shown adjacent to each other.

Steps to check or reproduce

Please use the below code

// for ESM environment, need to import modules as:
// import bb, {bar, spline, line, area, step} from "billboard.js";

var chart = bb.generate({
axis:{
    "y": {
        "label": {
            "text": "",
            "position": "outer-middle"
        },
        "show": true,
        "tick": {}
    },
    "x": {
        "tick": {
            "centered": true,
            "fit": false
        },
        "type": "timeseries",
        "label": {
            "text": "Time",
            "position": "outer-center"
        }
    }
},
  data: {
    "columns": [
        [
            "x1",
            "2025-04-14T04:00:00.000Z",
            "2025-04-15T04:00:00.000Z",
            "2025-04-16T04:00:00.000Z",
            "2025-04-17T04:00:00.000Z"
        ],
        [
            "x1;Min",
            59.52737808227539,
            59.962928771972656,
            58.61371612548828,
            59.538551330566406
        ],
        [
            "x2",
            "2025-04-14T04:00:00.000Z",
            "2025-04-15T04:00:00.000Z",
            "2025-04-16T04:00:00.000Z",
            "2025-04-17T04:00:00.000Z"
        ],
        [
            "x2;Avg",
            68.56690895557404,
            68.67940294742584,
            66.09445456663768,
            68.81559082557415
        ],
        [
            "x3",
            "2025-04-13T10:00:00.000Z",
            "2025-04-13T16:00:00.000Z",
            "2025-04-13T22:00:00.000Z",
            "2025-04-14T04:00:00.000Z",
            "2025-04-14T10:00:00.000Z",
            "2025-04-14T16:00:00.000Z",
            "2025-04-14T22:00:00.000Z",
            "2025-04-15T04:00:00.000Z",
            "2025-04-15T10:00:00.000Z",
            "2025-04-15T16:00:00.000Z",
            "2025-04-15T22:00:00.000Z",
            "2025-04-16T04:00:00.000Z",
            "2025-04-16T10:00:00.000Z",
            "2025-04-16T16:00:00.000Z",
            "2025-04-16T22:00:00.000Z",
            "2025-04-17T04:00:00.000Z",
            "2025-04-17T10:00:00.000Z",
            "2025-04-17T16:00:00.000Z"
        ],
        [
            "x3;Max",
            68.76287078857422,
            74.49726104736328,
            70.2923583984375,
            71.42920684814453,
            76.30474853515625,
            76.8629379272461,
            72.29781341552734,
            68.31656646728516,
            78.83475494384766,
            78.25135803222656,
            70,
            67.7883071899414,
            73.42631530761719,
            72.258056640625,
            70.93533325195312,
            71.17542266845703,
            79.4247055053711,
            73
        ]
    ],
    "axes": {},
    "types": {
        "x1;Min": "bar",
        "x2;Avg": "bar",
        "x3;Max": "bar"
    },
    "colors": {
        "x1;Min": "#2ca02c",
        "x2;Avg": "#1f77b4",
        "x3;Max": "#d62728"
    },
    "xs": {
        "x1;Min": "x1",
        "x2;Avg": "x2",
        "x3;Max": "x3"
    },
    "xFormat": "%d-%b-%y %I:%M %p",
    "names": {
        "x1;Min": "Min",
        "x2;Avg": "Avg",
        "x3;Max": "Max"
    },
    "type": "bar"
},
  bindto: "#timeseriesChart"
});

And paste it in https://naver.github.io/billboard.js/demo/#Chart.TimeseriesChart, you can reproduce this issue.

Unrelated to the above example, below charts are the same chart with c3 and billboard

With c3.js

With billboard.js

[netil]

Hi @sainadh6414, the lastest c3.js also render as billboard.js does.

• https://jsfiddle.net/netil/85L3r4qm/

The "overlap" happens when same xs values are set for different x axes.
The idea of xs is positioning multiple x axes in same graph independently with other x axis, so having this criteria when dataseries to display has same x value, try to make them as single dataseries.