Заговор не рендеринг

Question

Я занимаюсь разработкой и PWA и пытаюсь использовать Plotly (JS) на нем, но некоторые части графика Plotly отрисовываются ниже для отображения данных (например, меток, кнопок, таких как скриншот, обрезка и тому, что должно отображаться при наведении курсора).

Я не изменяю стиль Plotly с помощью CSS или чего-либо не документированного

HTML:

<div class="plot-dialog hidden">
    <div class="plot-header">
        <span class="plot-station-name"></span>
        <select id="plot-var">
            <option value="voltage">Voltage</option>
            <option value="temp">Temperature</option>
            <option value="humi">Humidity</option>
            <option value="wind">Wind Speed</option>
        </select>
        <img src="images/back_arrow.svg" class="icon-return">
    </div>
    <div class="plot"></div>
</div>

CSS:

.plot-dialog {
    background: #ececec;
    border-radius: 2px;
    z-index: 1;

    width: 100%;
    height: 100%;
}

.plot-header {
    margin: 0;
    width: 100%;
    line-height: 2em;
    display: inline-block;
    position: fixed;
    z-index: 2;
    padding: 4px;

    box-sizing: border-box;
    background: #fff;
    border-radius: 2px;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
}

.icon-return, .line-graph, .details-close-icon {
    width: 2em;
    float: right;
    margin-left: 1em;
}

.plot {
    max-width: 100%;
    padding-top: 3.5em;
}

Javascript:

app.updatePlots = function(){
    if(app.hasOwnProperty('plotData')){
        let dates = Object.keys(app.plotData).sort((a, b) => {return new Date(b).getTime() - new Date(a).getTime()});
        let traces = [];
        switch (document.querySelector("#plot-var").value){
            case "voltage":{
                let sol = JSON.parse(JSON.stringify(dates))
                .map(function(k){
                    return app.plotData[k].vps;
                });
                let bat = JSON.parse(JSON.stringify(dates))
                    .map(function(k){
                        return app.plotData[k].vbat;
                    });
                traces = [{x: dates, y:sol, name:"Solar Panel"}, {x:dates, y:bat, name:"Battery Voltage"}];
                break;
            }
            case "temp":{
                let temp = JSON.parse(JSON.stringify(dates))
                    .map(function(k){
                        return app.plotData[k].avgT;
                    });
                traces = [{x: dates, y: temp, name:"Temperature"}];
                break;
            }
            case "humi":{
                let humi = JSON.parse(JSON.stringify(dates))
                    .map(function(k){
                        return app.plotData[k].avgH;
                    });
                traces = [{x: dates, y:humi, name:"Humidity"}];
                break;
            }
            case "wind":{
                let wind = JSON.parse(JSON.stringify(dates))
                    .map(function(k){
                        return app.plotData[k].winS;
                    });
                traces = [{x: dates, y:wind, name:"Wind Speed"}];
                break;
            }
        }
        Plotly.purge(document.querySelector(".plot"));
        Plotly.plot(
            document.querySelector(".plot"),
            traces,
            {
                margin: {l:16, t:0},
                autosize: false,
                xaxis: {title: "Date"}
            }
        );
    }
}