Chart.js render not correct

[nlpsl202]

wkhtmltopdf version(s) affected: 0.12.6

OS information
Win 10

Description
I use wkhtmltopdf to render a chart.js page, there is chart rendered, but not correct, just like the example

Web's correct chart

Pdf's wrong chart:

the line is in wrong place, don't know why
is there any setting i missed?

here is my html code

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>

<div style="width: 1000px;"> <canvas id="canvas" style="width: 1000px;"></canvas> </div>

`<script type="text/javascript">
(function (setLineDash) {
CanvasRenderingContext2D.prototype.setLineDash = function () {
if (!arguments[0].length) {
arguments[0] = [1, 0];
}
// Now, call the original method
return setLineDash.apply(this, arguments);
};
})(CanvasRenderingContext2D.prototype.setLineDash);
Function.prototype.bind = Function.prototype.bind || function (thisp) {
var fn = this;
return function () {
return fn.apply(thisp, arguments);
};
};

    function drawGraphs() {
        new Chart(
            document.getElementById("canvas"), {
                "responsive": false,
                "type": "line",
                "data": { "labels": ["January", "February", "March", "April", "May", "June", "July"], "datasets": [{ "label": "My First Dataset", "data": [65, 59, 80, 81, 56, 55, 40], "fill": false, "borderColor": "rgb(75, 192, 192)", "lineTension": 0.1 }] },
                "options": {}
            }
        );
    }
    window.onload = function () {
        drawGraphs();
    };
</script>`