Created
May 21, 2014 17:02
-
-
Save paulodiogo/6660710537c2ed034e71 to your computer and use it in GitHub Desktop.
index
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="UTF-8"> | |
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | |
<title>Gráficos</title> | |
</head> | |
<body> | |
<div id="contain" style="height: 400px"></div> | |
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> | |
<script src="http://code.highcharts.com/highcharts.js"></script> | |
<script type="text/javascript"> | |
Date.prototype.formated = function() { | |
return (this.getMonth() + 1) + "/" + this.getFullYear(); | |
}; | |
var chart; | |
var dummyData = [{"name":"IGPM","id":"53783df7e4b041c8571f0f34","values":[{"value":8.14,"month":1230775200000},{"value":7.85,"month":1233453600000},{"value":6.27,"month":1235876400000},{"value":5.38,"month":1238554800000},{"value":3.64,"month":1241146800000},{"value":1.53,"month":1243825200000},{"value":-0.66,"month":1246417200000},{"value":-0.7,"month":1249095600000},{"value":-0.39,"month":1251774000000},{"value":-1.31,"month":1254366000000},{"value":-1.58,"month":1257040800000},{"value":-1.71,"month":1259632800000},{"value":-0.66,"month":1262311200000},{"value":0.26,"month":1264989600000},{"value":1.95,"month":1267412400000},{"value":2.89,"month":1270090800000},{"value":4.19,"month":1272682800000},{"value":5.18,"month":1275361200000},{"value":5.79,"month":1277953200000},{"value":6.99,"month":1280631600000},{"value":7.77,"month":1283310000000},{"value":8.8,"month":1285902000000},{"value":10.27,"month":1288576800000},{"value":11.32,"month":1291168800000},{"value":11.5,"month":1293847200000},{"value":11.3,"month":1296525600000},{"value":10.95,"month":1298948400000},{"value":10.6,"month":1301626800000},{"value":9.76,"month":1304218800000},{"value":8.64,"month":1306897200000},{"value":8.35,"month":1309489200000},{"value":8,"month":1312167600000},{"value":7.46,"month":1314846000000},{"value":6.95,"month":1317438000000},{"value":5.95,"month":1320112800000},{"value":5.1,"month":1322704800000},{"value":4.53,"month":1325383200000},{"value":3.44,"month":1328061600000},{"value":3.24,"month":1330570800000},{"value":3.65,"month":1333249200000},{"value":4.26,"month":1335841200000},{"value":5.14,"month":1338519600000},{"value":6.68,"month":1341111600000},{"value":7.73,"month":1343790000000},{"value":8.07,"month":1346468400000},{"value":7.52,"month":1349060400000},{"value":6.96,"month":1351735200000},{"value":7.81,"month":1354327200000},{"value":7.91,"month":1357005600000},{"value":8.29,"month":1359684000000},{"value":8.05,"month":1362106800000},{"value":7.3,"month":1364785200000},{"value":6.22,"month":1367377200000},{"value":6.31,"month":1370055600000},{"value":5.18,"month":1372647600000},{"value":3.85,"month":1375326000000},{"value":4.4,"month":1378004400000},{"value":5.16,"month":1380596400000},{"value":5.48,"month":1383271200000},{"value":5.4,"month":1385863200000},{"value":5.54,"month":1388541600000}]},{"name":"IPCA","id":"537cb31be4b0123641162023","values":[{"value":5.84,"month":1230775200000},{"value":5.9,"month":1233453600000},{"value":5.61,"month":1235876400000},{"value":5.53,"month":1238554800000},{"value":5.2,"month":1241146800000},{"value":4.8,"month":1243825200000},{"value":4.5,"month":1246417200000},{"value":4.36,"month":1249095600000},{"value":4.34,"month":1251774000000},{"value":4.17,"month":1254366000000},{"value":4.22,"month":1257040800000},{"value":4.31,"month":1259632800000},{"value":4.59,"month":1262311200000},{"value":4.83,"month":1264989600000},{"value":5.17,"month":1267412400000},{"value":5.26,"month":1270090800000},{"value":5.22,"month":1272682800000},{"value":4.84,"month":1275361200000},{"value":4.6,"month":1277953200000},{"value":4.49,"month":1280631600000},{"value":4.7,"month":1283310000000},{"value":5.2,"month":1285902000000},{"value":5.64,"month":1288576800000},{"value":5.91,"month":1291168800000},{"value":5.99,"month":1293847200000},{"value":6.01,"month":1296525600000},{"value":6.3,"month":1298948400000},{"value":6.51,"month":1301626800000},{"value":6.55,"month":1304218800000},{"value":6.71,"month":1306897200000},{"value":6.87,"month":1309489200000},{"value":7.23,"month":1312167600000},{"value":7.31,"month":1314846000000},{"value":6.97,"month":1317438000000},{"value":6.64,"month":1320112800000},{"value":6.5,"month":1322704800000},{"value":6.22,"month":1325383200000},{"value":5.85,"month":1328061600000},{"value":5.24,"month":1330570800000},{"value":5.1,"month":1333249200000},{"value":4.99,"month":1335841200000},{"value":4.92,"month":1338519600000},{"value":5.2,"month":1341111600000},{"value":5.24,"month":1343790000000},{"value":5.28,"month":1346468400000},{"value":5.45,"month":1349060400000},{"value":5.53,"month":1351735200000},{"value":5.84,"month":1354327200000},{"value":6.15,"month":1357005600000},{"value":6.31,"month":1359684000000},{"value":6.59,"month":1362106800000},{"value":6.49,"month":1364785200000},{"value":6.5,"month":1367377200000},{"value":6.7,"month":1370055600000},{"value":6.27,"month":1372647600000},{"value":6.09,"month":1375326000000},{"value":5.86,"month":1378004400000},{"value":5.86,"month":1380596400000},{"value":5.69,"month":1383271200000},{"value":5.63,"month":1385863200000},{"value":5.76,"month":1388541600000}]},{"name":"SELIC","id":"537cb4efe4b0123641162024","values":[{"value":13.43,"month":1230775200000},{"value":12.75,"month":1233453600000},{"value":11.78,"month":1235876400000},{"value":11.22,"month":1238554800000},{"value":10.25,"month":1241146800000},{"value":9.62,"month":1243825200000},{"value":9.1,"month":1246417200000},{"value":8.75,"month":1249095600000},{"value":8.75,"month":1251774000000},{"value":8.75,"month":1254366000000},{"value":8.75,"month":1257040800000},{"value":8.75,"month":1259632800000},{"value":8.75,"month":1262311200000},{"value":8.75,"month":1264989600000},{"value":8.75,"month":1267412400000},{"value":8.8,"month":1270090800000},{"value":9.5,"month":1272682800000},{"value":10.03,"month":1275361200000},{"value":10.41,"month":1277953200000},{"value":10.75,"month":1280631600000},{"value":10.75,"month":1283310000000},{"value":10.75,"month":1285902000000},{"value":10.75,"month":1288576800000},{"value":10.75,"month":1291168800000},{"value":10.94,"month":1293847200000},{"value":11.25,"month":1296525600000},{"value":11.72,"month":1298948400000},{"value":11.8,"month":1301626800000},{"value":12,"month":1304218800000},{"value":12.18,"month":1306897200000},{"value":12.34,"month":1309489200000},{"value":12.5,"month":1312167600000},{"value":12,"month":1314846000000},{"value":11.81,"month":1317438000000},{"value":11.5,"month":1320112800000},{"value":11,"month":1322704800000},{"value":10.79,"month":1325383200000},{"value":10.5,"month":1328061600000},{"value":9.92,"month":1330570800000},{"value":9.45,"month":1333249200000},{"value":8.98,"month":1335841200000},{"value":8.5,"month":1338519600000},{"value":8.18,"month":1341111600000},{"value":7.97,"month":1343790000000},{"value":7.5,"month":1346468400000},{"value":7.33,"month":1349060400000},{"value":7.25,"month":1351735200000},{"value":7.25,"month":1354327200000},{"value":7.25,"month":1357005600000},{"value":7.25,"month":1359684000000},{"value":7.25,"month":1362106800000},{"value":7.36,"month":1364785200000},{"value":7.53,"month":1367377200000},{"value":8,"month":1370055600000},{"value":8.34,"month":1372647600000},{"value":8.55,"month":1375326000000},{"value":9,"month":1378004400000},{"value":9.25,"month":1380596400000},{"value":9.55,"month":1383271200000},{"value":10,"month":1385863200000},{"value":10.25,"month":1388541600000}]}]; | |
function requestData(data) { | |
var series = []; | |
$(data).each(function(a,b){ | |
var procData = $.map(b.values, function(item){ | |
return [[(new Date(item.month)).formated(), item.value]]; | |
}); | |
procData.sort(function(a, b){ | |
return a[0] - b[0]; | |
}); | |
series.push({name : b.name, data: procData}); | |
}); | |
return series; | |
} | |
function getName(data){ | |
var chartTitle = ''; | |
$(data).each(function(a,b){ | |
chartTitle = chartTitle.concat(b.name.concat(' X ')); | |
}); | |
return { text: chartTitle.replace(/ X $/g, ''), x : -20}; | |
} | |
$(document).ready(function() { | |
chart = new Highcharts.Chart({ | |
chart: { | |
renderTo: 'contain', | |
defaultSeriesType: 'line', | |
marginRight: 130, | |
marginBottom: 25 | |
}, | |
title: getName(dummyData), | |
subtitle: { | |
text: 'Não interessa!', | |
x: -20 | |
}, | |
xAxis: { | |
type: 'category' | |
}, | |
yAxis: { | |
title: { | |
text: '(%)' | |
}, | |
plotLines: [{ | |
value: 0, | |
width: 1, | |
color: '#808080' | |
}] | |
}, | |
plotOptions: { | |
line: { | |
marker: {enabled: false} | |
} | |
}, | |
tooltip: { | |
formatter: function() { | |
return '<b>'+ this.series.name +'</b><br/>'+ | |
this.key +': '+ this.y +'%'; | |
} | |
}, | |
legend: { | |
layout: 'vertical', | |
align: 'right', | |
verticalAlign: 'top', | |
x: -10, | |
y: 100, | |
borderWidth: 0 | |
}, | |
series : requestData(dummyData) | |
} | |
) | |
}); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment