PC crash when i use Chrome

PC crash when i use Chrome

Hello,
I have a problem when I use jqxChart with Google Chrome or Chromium ...

When I run my index.php file, my mouse is idling and my PC is very slow. I have to reboot to make it back to normal.

But when I run my index.php in Mozilla Firefox, I have no problem and my graphic display normally.

Do you know what is the problem with Chrome / Chromium?

Thank you in advance

  1. index.php : 
  3. <!DOCTYPE html>
  4. <html lang="en">
  5. <head>
  6.     <title id='Description'>jqxChart Stacked Column Series Example</title>
  7.     <link rel="stylesheet" href="js/styles/jqx.base.css" type="text/css" />
  8.     <script type="text/javascript" src="js/scripts/jquery-1.11.1.min.js"></script>
  9.     <script type="text/javascript" src="js/jqxcore.js"></script>
  10.     <script type="text/javascript" src="js/jqxdata.js"></script>
  11.     <script type="text/javascript" src="js/jqxdraw.js"></script>
  12.     <script type="text/javascript" src="js/jqxchart.core.js"></script>
  13.     <script type="text/javascript">
  14.         $(document).ready(function () {
  15.             // prepare chart data as an array
  16.             var sampleData = [
  17.                     { Day: '01-12-14', ED: 200, PO: 300, VP: 35, VPN: 45 },
  18.                     { Day: '02-12-14', ED: 150, PO: 425, VP: 20, VPN: 55 },
  19.                     { Day: '03-12-14', ED: 250, PO: 400, VP: 35, VPN: 35 }
  20.                 ];
  21.             // prepare jqxChart settings
  22.             var settings = {
  23.                 title: "Test stats N2",
  24.                 description: "",
  25.                 enableAnimations: true,
  26.                 showLegend: true,
  27.                 padding: { left: 5, top: 5, right: 5, bottom: 5 },
  28.                 titlePadding: { left: 90, top: 0, right: 0, bottom: 10 },
  29.                 source: sampleData,
  30.                 xAxis:
  31.                     {
  32.                         dataField: 'Day',
  33.                         unitInterval: 1,
  34.                         axisSize: 'auto',
  35.                         tickMarks: {
  36.                             visible: true,
  37.                             interval: 1,
  38.                             color: '#BCBCBC'
  39.                         },
  40.                         gridLines: {
  41.                             visible: true,
  42.                             interval: 1,
  43.                             color: '#BCBCBC'
  44.                         }
  45.                     },
  46.                 valueAxis:
  47.                 {
  48.                   //  unitInterval: 10,
  49.                     //minValue: 0,
  50.                    // maxValue: 120,
  51.                     title: { text: 'Nb de connexions' },
  52.                     labels: { horizontalAlignment: 'right' },
  53.                     tickMarks: { color: '#BCBCBC' }
  54.                 },
  55.                 colorScheme: 'scheme06',
  56.                 seriesGroups:
  57.                     [
  58.                         {
  59.                             type: 'stackedcolumn',
  60.                             columnsGapPercent: 50,
  61.                             seriesGapPercent: 0,
  62.                             series: [
  63.                                     { dataField: 'ED', displayText: 'ED' },
  64.                                     { dataField: 'PO', displayText: 'PO' },
  65.                                     { dataField: 'VP', displayText: 'VP' },
  66.                                     { dataField: 'VPN', displayText: 'VPN' }
  67.                                 ]
  68.                         }
  69.                     ]
  70.             };
  71.             // setup the chart
  72.             $('#chartContainer').jqxChart(settings);
  73.         });
  74.     </script>
  75. </head>
  76. <body class='default'>
  77.     <div id='chartContainer' style="width:850px; height:500px;"/>
  78. </body>
  79. </html>