Home › Forums › Chart Support › Chrome crash "Render process gone"

Chrome crash "Render process gone"

Viewing 5 posts - 1 through 5 (of 5 total)
  • May 10, 2019 at 8:27 pm #25137

    smarco

    After a while Chome Crash with “Render process gone”

    <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title></title>
    <script src="js/canvasjs.min.js"></script>
    <script src="js/jquery.js"></script>

    <script type="text/javascript">
        function prod01() {
            $(document).ready(function () {
                $.getJSON("data.php", {device: "prod01", limit: "120", type: "total"}, function (result) {
                    $.getJSON("data.php", {device: "prod01", limit: "120", type: "full"}, function (result2) {

                        var chart = new CanvasJS.Chart("prod01", {
                            zoomEnabled: true,
                            title:{
                                text: "Prod01",
                                fontSize: "18",
                                fontFamily: "tahoma",
                                fontWeight: "bold",
                                dockInsidePlotArea: true
                            },
                            axisX:{
                                intervalType: "minute",
                                valueFormatString: "HH mm",
                                labelAngle: 0
                            },
                            data: [
                                {
                                    type: "spline",
                                    xValueType: "dateTime",
                                    name: "totali",
                                    showInLegend: "true",
                                    dataPoints: result
                                 },
                                 {
                                    type: "column",
                                    xValueType: "dateTime",
                                    name: "vuote",
                                    showInLegend: "true",
                                    dataPoints: result2
                                 }
                            ]
                        });

                        chart.render();
                        setTimeout(prod01, 500);
                    });
                });
            });
        }

        function prod02() {
            $(document).ready(function () {
                $.getJSON("data.php", {device: "prod01", limit: "120", type: "total"}, function (result) {
                    $.getJSON("data.php", {device: "prod01", limit: "120", type: "full"}, function (result2) {

                        var chart = new CanvasJS.Chart("prod02", {
                            zoomEnabled: true,
                            title:{
                                text: "Prod02",
                                fontSize: "18",
                                fontFamily: "tahoma",
                                fontWeight: "bold",
                                dockInsidePlotArea: true
                            },
                            axisX:{
                                intervalType: "minute",
                                valueFormatString: "HH mm",
                                labelAngle: 0
                            },
                            data: [
                                {
                                    type: "spline",
                                    xValueType: "dateTime",
                                    name: "totali",
                                    showInLegend: "true",
                                    dataPoints: result
                                 },
                                 {
                                    type: "column",
                                    xValueType: "dateTime",
                                    name: "vuote",
                                    showInLegend: "true",
                                    dataPoints: result2
                                 }
                            ]
                        });

                        chart.render();
                        setTimeout(prod02, 500);
                    });
                });
            });
        }

        prod01();
        prod02();
    </script>
</head>
<body>
<div id="prod01" style="width: 700px; height: 300px;"></div>
<div id="prod02" style="width: 700px; height: 300px;"></div>
</body>
</html>
    May 10, 2019 at 8:43 pm #25139

    smarco

    Same result with only one funcion [ prod01(); ]
    Setting hi-speed refresh [ setTimeout(prod02, 100); ] the crash happens within a few minutes

    May 13, 2019 at 3:15 pm #25146

    smarco

    You can test this “memory leak” with the HTML code and this “sample” PHP

    file: data.php

    <?php

$data_points = array();

for ($i = 1; $i <= 10; $i++) {
  $timestamp = time() -($i*60)."000";
  $random = rand(20, 30);
  $point = array("x" => $timestamp, "y" => $random);
  array_push($data_points, $point);
}

echo json_encode($data_points, JSON_NUMERIC_CHECK);

?>

    Where am I doing wrong?
    I’m interested in buying the license if it works

    May 13, 2019 at 3:57 pm #25149

    Vishwas R

    @smarco,

    I observe that you are performing AJAX request inside AJAX request within which you are creating chart (i.e. a new chart is created every 500ms). Instead, you can create chart once, update dataPoints every 500ms and re-render the chart. Please take a look at this updated code sample.
    Dynamic Chart in PHP

    —
    Vishwas R
    Team CanvasJS

    May 13, 2019 at 7:50 pm #25156

    smarco

    Hello Vishwas,

    thank you for your quick reply and revised code!

    I will test it and update you

    Regards
    Marco

    • This reply was modified 5 years, 4 months ago by smarco.
Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.