Download as
Browse Code »

Commit 76b0fb72c6c3b7a3543b45cef1773a8b6edd18cc

Authored by fbormann
1 parent 49ef3290
Exists in master and in 3 other branches amadeus_univasf, image-crop, refactoring

pie chart has a title and hover on items now, still some improvements to do

Showing 3 changed files with 59 additions and 13 deletions   Show diff stats
amadeus/static/css/base/amadeus.css
  Diff comments   View file @76b0fb7
@@ -1125,4 +1125,25 @@ li.item .notify_badge { @@ -1125,4 +1125,25 @@ li.item .notify_badge {
1125 1125
1126 .btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus { 1126 .btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus {
1127 outline: none; 1127 outline: none;
1128 -}  
1129 \ No newline at end of file 1128 \ No newline at end of file
  1129 +}
  1130 +
  1131 +
  1132 +/* CHART APP */
  1133 +.pie-tooltip{
  1134 + background: #eee;
  1135 + box-shadow: 0 0 5px #999999;
  1136 + color: #333;
  1137 + display: none;
  1138 + font-size: 30px;
  1139 + left: 130px;
  1140 + padding: 10px;
  1141 + position: absolute;
  1142 + text-align: center;
  1143 + top: 95px;
  1144 + width: 80px;
  1145 + z-index: 10;
  1146 +}
  1147 +
  1148 +
  1149 +
  1150 +/**/
1130 \ No newline at end of file 1151 \ No newline at end of file
amadeus/static/js/charts/home.js
  Diff comments   View file @76b0fb7
@@ -17,10 +17,11 @@ var resource_donut_chart = { @@ -17,10 +17,11 @@ var resource_donut_chart = {
17 $.get(url, function(dataset){ 17 $.get(url, function(dataset){
18 18
19 19
20 - var width = 360;  
21 - var height = 400;  
22 - var radius = Math.min(width, height) / 2;  
23 - 20 + var width = 600;
  21 + var height = 480;
  22 + var padding = 30;
  23 + var radius = Math.min(width, height) / 2 - padding;
  24 +
24 var color = d3.scaleOrdinal(d3.schemeCategory20c); 25 var color = d3.scaleOrdinal(d3.schemeCategory20c);
25 var new_div = d3.select(".carousel-inner").append("div").attr("class","item"); 26 var new_div = d3.select(".carousel-inner").append("div").attr("class","item");
26 var svg = new_div.append("svg").attr("width", width).attr("height", height) 27 var svg = new_div.append("svg").attr("width", width).attr("height", height)
@@ -28,8 +29,9 @@ var resource_donut_chart = { @@ -28,8 +29,9 @@ var resource_donut_chart = {
28 .style("display","block") 29 .style("display","block")
29 .append('g') 30 .append('g')
30 .attr('transform', 'translate(' + (width / 2) + 31 .attr('transform', 'translate(' + (width / 2) +
31 - ',' + (height / 2) + ')'); 32 + ',' + (height / 2 ) + ')');
32 33
  34 +
33 35
34 var donutInner = 50; 36 var donutInner = 50;
35 var arc = d3.arc() 37 var arc = d3.arc()
@@ -37,16 +39,19 @@ var resource_donut_chart = { @@ -37,16 +39,19 @@ var resource_donut_chart = {
37 .outerRadius(radius); 39 .outerRadius(radius);
38 40
39 svg.append("text") 41 svg.append("text")
40 - .attr("x", (width / 2))  
41 - .attr("y", 0 - (height / 2))  
42 - .attr("text-anchor", "middle")  
43 - .style("font-size", "16px")  
44 - .text("Recurso mais utilizado"); 42 + .attr("text-anchor", "middle")
  43 + .attr("x",0 )
  44 + .attr("y", -height/2 + padding)
  45 + .style("font-size", "30px")
  46 + .text("Recursos mais utilizados");
  47 +
45 48
46 var pie = d3.pie() 49 var pie = d3.pie()
47 .value(function(d) { return d[1]; }) 50 .value(function(d) { return d[1]; })
48 .sort(null); 51 .sort(null);
49 52
  53 +
  54 +
50 var path = svg.selectAll('path') 55 var path = svg.selectAll('path')
51 .data(pie(dataset)) 56 .data(pie(dataset))
52 .enter() 57 .enter()
@@ -55,6 +60,28 @@ var resource_donut_chart = { @@ -55,6 +60,28 @@ var resource_donut_chart = {
55 .attr('fill', function(d, i) { 60 .attr('fill', function(d, i) {
56 return color(i); 61 return color(i);
57 }); 62 });
  63 +
  64 +
  65 + svg.selectAll("text.pie-tooltip")
  66 + .data(dataset)
  67 + .enter()
  68 + .append("text")
  69 + .text(function(d){
  70 + return d[0];
  71 + })
  72 + .attr("id", function(d){
  73 + return d[0];
  74 + })
  75 + .attr("class","pie-tooltip");
  76 +
  77 + path.on('mouseover', function(d) { //When the mouse is over the path
  78 + $('#'+d.data[0]).css("display", "block");
  79 + });
  80 +
  81 + path.on('mouseout', function(d) { //When the mouse "leaves" the path
  82 + t = $('#'+d.data[0]).css("display", "none");
  83 + });
  84 +
58 }) // end of the get method 85 }) // end of the get method
59 } 86 }
60 } 87 }
topics/views.py
  Diff comments   View file @76b0fb7
@@ -274,8 +274,6 @@ def getResourceCount(request): @@ -274,8 +274,6 @@ def getResourceCount(request):
274 else: 274 else:
275 data[key] = 1 275 data[key] = 1
276 276
277 - data["test"] = 30  
278 - data["azul"] = 20  
279 real_data = [] 277 real_data = []
280 for item in data.items(): 278 for item in data.items():
281 real_data.append(item) 279 real_data.append(item)