"Most prolific hours of the day" displays incorrectly when some hours have no XP/flows

On my profile page, the cursor is pointing to 16-17 but the label shows 18-19, and the flow time of 12-13, 13-14 is blue.

It seems that it's because I have no flow at 06-08, so Chart.js just skip those hours.

<section id="top-hours" class="top-hours" phx-hook="TopHours">
    <h4>Most prolific hours of the day</h4>
    <div id="top-hours-dataset">
        ({
            x:[
                {h:"00",x:190344},
                {h:"01",x:166580},
                {h:"02",x:113533},
                {h:"03",x:72886},
                {h:"04",x:26660},
                {h:"05",x:6909},
                {h:"06",x:863},
                {h:"07",x:45},
                {h:"08",x:10441},
                {h:"09",x:40928},
                {h:"10",x:70742},
                {h:"11",x:57300},
                {h:"12",x:107679},
                {h:"13",x:153549},
                {h:"14",x:226389},
                {h:"15",x:259491},
                {h:"16",x:280391},
                {h:"17",x:208268},
                {h:"18",x:133659},
                {h:"19",x:168204},
                {h:"20",x:249315},
                {h:"21",x:197781},
                {h:"22",x:155007},
                {h:"23",x:164712},
            ],
            f:[
                {h:"00",m:3469},
                {h:"01",m:2875},
                {h:"02",m:2159},
                {h:"03",m:1649},
                {h:"04",m:636},
                {h:"05",m:128}, // notice here
                {h:"08",m:289},
                {h:"09",m:731},
                {h:"10",m:955},
                {h:"11",m:878},
                {h:"12",m:1277},
                {h:"13",m:2326},
                {h:"14",m:3857},
                {h:"15",m:4546},
                {h:"16",m:5417},
                {h:"17",m:3691},
                {h:"18",m:1702},
                {h:"19",m:2965},
                {h:"20",m:4133},
                {h:"21",m:3384},
                {h:"22",m:2571},
                {h:"23",m:2448},
            ]
        })
    </div>
    <div id="top-hours-chart" phx-update="ignore"></div>
</section>