HighCharts Pie Test
Attempting to get data to pie from table
by nerevar
HTML
<script src="http://www.highcharts.com/js/highcharts.js"></script>
<div id="container"></div>
CSS
#container
{
margin: 20px auto 0;
height: 500px;
}
JavaScript
var chart;
window.getJSON = function(url) {
var script = document.createElement("script");
script.setAttribute("type", "text/javascript");
// append timestamp to avoid browser caching
url += (url.indexOf("?") == -1 ? "?" : "&amp;amp;") + (new Date().getTime());
script.setAttribute("src", url);
document.body.appendChild(script);
setTimeout(function() {
document.body.removeChild(script);
}, 2000);
};
window.onInputData = function(data) {
var timings = {
"blocked": 0,
"dns": 0,
"connect": 0,
"send": 0,
"wait": 0,
"receive": 0
};
data.log.entries.forEach(function(item){
// если это картинка с сервера im*-tub-ru.yandex.net
if (item.request.url.indexOf('tub-ru.yandex.net') > 0) {
for (var key in timings) {
timings[key] += item.timings[key];
}
}
});
chart = new Highcharts.Chart(
{
"series":[
{
"name":"Time, ms",
"type":"pie",
"sliced":true,
"data":[
[
"Blocked", timings.blocked
],
[
"Connect", timings.connect
],
[
"DNS", timings.dns
],
[
"Receive", timings.receive
],
[
"Send", timings.send
],
[
"Wait", timings.wait
],
],
"pointWidth":15,
"color":"#C6D9E7",
"borderColor":"#8BB6D9",
"shadow":true,
}
],
"title":{
"text": "Thumbs load timings"
},
"legend":{
"layout":"vertical",
"style":{
"left":"auto",
...