| <html> |
| <head> |
| <script type="text/javascript" src="https://www.google.com/jsapi"></script> |
| <script type="text/javascript"> |
| |
| google.load("visualization", "1.0", {packages:["corechart"]}); |
| google.setOnLoadCallback(drawRssChart); |
| google.setOnLoadCallback(drawPssChart); |
| |
| /* |
| These funtions create data tables from previously formatted arrays. |
| Data array is created by the ProcSnapshot class and formatted as such: |
| [Timestamp, PID1, PID2, PID3,...], also need descriptive title. |
| */ |
| |
| function drawRssChart() { |
| var data = google.visualization.arrayToDataTable(%(Rss)s); |
| var options = { |
| title: "RSS [MBs] per PID Over Time", |
| hAxis: {title: "Seconds since boot", |
| titleTextStyle: {color: 'green'}}, |
| vAxis: {title: "RSS [MB]", titleTextStyle: {color: 'green'}}, |
| }; |
| |
| var cdiv = document.getElementById('rss_chart'); |
| var chart = new google.visualization.LineChart(cdiv); |
| chart.draw(data, options); |
| } |
| |
| function drawPssChart() { |
| var data = google.visualization.arrayToDataTable(%(Pss)s); |
| var options = { |
| title: "PSS [MBs] per PID Over Time", |
| hAxis: {title: "Seconds since boot", |
| titleTextStyle: {color: 'green'}}, |
| vAxis: {title: "PSS [MB]", titleTextStyle: {color: 'green'}}, |
| }; |
| |
| var cdiv = document.getElementById('pss_chart'); |
| var chart = new google.visualization.LineChart(cdiv); |
| chart.draw(data, options); |
| } |
| |
| </script> |
| </head> |
| |
| <body> |
| |
| <p> Shows memory trends by process IDs over a given period of time. |
| Data logged starting at %(timestamp)s. </p> |
| <p> System information: %(version)s; |
| ChromeOS release description: %(release)s </p> |
| |
| </br> |
| |
| <p> Graph showing resident set size - memory mapped into RAM. |
| </br> |
| Description for the RSS graph - actions taken, etc. |
| </p> |
| <div id="rss_chart", style="width:900px; height:500px; margin:auto;"></div> |
| |
| </br> |
| |
| <p> Graph showing proportional set size - private + proportional shared. |
| </br> |
| Description for the PSS graph - actions taken, etc. |
| </p> |
| <div id="pss_chart", style="width:900px; height:500px; margin:auto;"></div> |
| |
| </body> |
| </html> |
