wkhtmltopdf on PHP not working with JS with this Errors: "libpng warning: iCCP: known incorrect sRGB profile" and "Segmentation fault"

Question

Dears, I have this error message when I try to convert my HTML to PDF using phpwkhtmltopdf with rendering Chart.JS Graph:

Loading pages (1/6)
[> ] 0%
[======> ] 10%
[=================> ] > 29%
[========================> ] 41%
libpng warning: iCCP: known incorrect sRGB profile
[==========================> ] 44 [====================================================> ] 88 [============================================================] 100%
Segmentation fault (core dumped)

I used:

Ubuntu Server version 16 with PHP Nginx

Wkhtmltobdf version 0.12.4

Phpwkhtmltopdf: https://github.com/mikehaertl/phpwkhtmltopdf

Chart.js version: 2.5.0

This issue appear with this javascript code for "chart.js":

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script>
<script>
        var canvas = document.getElementById("barChart");
        var ctx = canvas.getContext('2d');

        ctx.canvas.width = 600;
        ctx.canvas.height = 300;

        // Global Options:
        Chart.defaults.global.defaultFontColor = 'black';
        Chart.defaults.global.defaultFontSize = 14;

        var data = {
          labels: ["","Subject 3","Subject 1","Subject 2",""],
          datasets: [{
              label: "Degree",
              fill: false,
              lineTension: 0,
              backgroundColor: "rgba(0,0,0,0)",
              borderColor: "black", // The main line color
              borderCapStyle: 'line',
              borderDash: [], // try [5, 15] for instance
              borderDashOffset: 0.0,
              borderJoinStyle: 'miter',
              pointBorderColor: "black",
              pointBackgroundColor: "white",
              pointBorderWidth: 2,
              pointHoverRadius: 8,
              pointHoverBackgroundColor: "white",
              pointHoverBorderColor: "white",
              pointHoverBorderWidth: 2,
              pointRadius: 4,
              pointHitRadius: 10,
              data: [null, 29,40,40,null],
              spanGaps: true
            }]
        };

        var options = {
            responsive: true,
            maintainAspectRatio: false,
            scales: {
                    yAxes: [{
                        ticks: {
                            max: 100,
                            min: 0,
                            stepSize: 15,
                            scaleOverride : true,
                            scaleStepWidth : 15,
                        },
                        scaleLabel: {
                             display: true,
                             labelString: 'Degree',
                             fontSize: 20 
                        }
                    }],
                    xAxes: [{
                        ticks: {
                            fontSize: 12
                        },
                        afterFit: function(scale) {
                            scale.height = 80;
                        }
                        /*scaleLabel: {
                            display: true,
                            labelString: 'Exams',
                            fontSize: 20
                        },*/
                    }]
                },
            legend: {
                    display: false
                },
            animation: {
                duration: 1,
                /*onComplete: function(animation) {
                    console.log('done');
                }*/
            }
        };

        // Chart declaration:
        var myBarChart = new Chart(ctx, {
            type: 'line',
            data: data,
            options: options
        });

        Chart.plugins.register({
            beforeDraw: function(chartInstance) 
            {
                var ctx = chartInstance.chart.ctx;

                var chart_height = chartInstance.chart.height;
                var chart_width = chartInstance.chart.width;

                var chart_top_padding = 7;
                var chart_xAxes_height = 80;
                var chart_left_padding = 75;

                var chart_height_padding_perc = .13 * chart_height;

                var chart_height_area = chart_height - chart_xAxes_height - chart_top_padding;

                ctx.fillStyle = "#7abd5e";
                var green_start = chart_top_padding;
                var green_width = .21 * chart_height_area;
                ctx.fillRect(chart_left_padding, green_start, chart_width, green_width);

                ctx.fillStyle = "#459ce9";
                var blue_start = green_width + green_start;
                var blue_width = .15 * chart_height_area;
                ctx.fillRect(chart_left_padding, blue_start, chart_width, blue_width);

                ctx.fillStyle = "#f5c758";
                var orange_start = blue_start + blue_width;
                var orange_width = .19 * chart_height_area;
                ctx.fillRect(chart_left_padding, orange_start, chart_width, orange_width);

                ctx.fillStyle = "#e53535";
                var red_start = orange_start + orange_width;
                var red_width = .45 * chart_height_area;
                ctx.fillRect(chart_left_padding, red_start, chart_width, red_width);
            }
        });
</script>

Note: When I disable javascript, it's working fine but sure without chart. I try this on OS x same everything and it was working fine.

Any help or suggestions please