Skip to content

Instantly share code, notes, and snippets.

@paulodiogo
Created May 21, 2014 17:02
Show Gist options
  • Save paulodiogo/6660710537c2ed034e71 to your computer and use it in GitHub Desktop.
Save paulodiogo/6660710537c2ed034e71 to your computer and use it in GitHub Desktop.
index
<!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