ILB
/
sigi
mirror of https://github.com/interlegis/sigi.git
9
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Adicionando chartjs no grafico 2 de convenios

producao
Breno Teixeira 11 years ago
parent
5395004671
commit
0713268149
4 changed files with 26 additions and 79 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      sigi/context_processors.py
  2. 7
      sigiStatic/css/style.css
  3. 32
      templates/index.html
  4. 60
      templates/snippets/modules/charts-convenios.html

4
sigi/context_processors.py
View File

@ -128,7 +128,6 @@ def grafico_convenio_projeto(convenios):
'#8d4653',
'#91e8e1', ])
# colors = cycle(base_colors)
highlights = cycle(['#B0D3F4',
'#8E8E91',
'#BCF4B1',
@ -147,6 +146,9 @@ def grafico_convenio_projeto(convenios):
colors.next(),
highlights.next())
for projeto in projetos]
# remove projetos sem convenio
lista_projetos = [x for x in lista_projetos if x[1] > 0]
# print lista_projetos
# total_convenios = "Total: " + str(convenios.count())
# lista_projetos.insert(0, total_convenios)

7
sigiStatic/css/style.css
View File

@ -1,13 +1,14 @@
#canvas-holder {
#canvas-holder-1, #canvas-holder-2 {
padding: 20px 20px 20px 20px;
min-height: 180px;
position: relative;
margin-top: 110px;
margin-top: 47px;
margin-left: 20px;
}
.pie-legend {
list-style: none;
position: absolute;
right: 8px;
right: 50px;
top: 18px;
}
.pie-legend li span {

32
templates/index.html
View File

@ -63,29 +63,21 @@
{% endfor %}
]
window.onload = function(){
var canvas = document.getElementById("canvas-holder");
var canvas1 = document.getElementById("canvas-holder-1");
var ctx = document.getElementById("chart-area-1").getContext("2d");
window.myPie = new Chart(ctx).Pie(pieData1);
var ctx = document.getElementById("chart-area-2").getContext("2d");
window.myPie = new Chart(ctx).Pie(pieData2);
window.myPie = new Chart(ctx).Pie(pieData1).generateLegend();
var legendHolder = document.createElement('div');
legendHolder.innerHTML = myPie.generateLegend();
// Include a html legend template after the module doughnut itself
{# var helpers = Chart.helpers;#}
{# helpers.each(legendHolder.firstChild.childNodes, function(legendNode, index){#}
{# helpers.addEvent(legendNode, 'mouseover', function(){#}
{# var activeSegment = myPie.segments[index];#}
{# activeSegment.save();#}
{# activeSegment.fillColor = activeSegment.highlightColor;#}
{# myPie.showTooltip([activeSegment]);#}
{# activeSegment.restore();#}
{# });#}
{# });#}
{# helpers.addEvent(legendHolder.firstChild, 'mouseout', function(){#}
{# myPie.draw();#}
{# });#}
canvas.appendChild(legendHolder.firstChild);
legendHolder.innerHTML = myPie;
canvas1.appendChild(legendHolder.firstChild);
var canvas2 = document.getElementById("canvas-holder-2");
var ctx2 = document.getElementById("chart-area-2").getContext("2d");
window.myPie2 = new Chart(ctx2).Pie(pieData2);
var legendHolder2 = document.createElement('div');
legendHolder2.innerHTML = myPie2.generateLegend();
canvas2.appendChild(legendHolder2.firstChild);
};
{% endfor %}
</script>

60
templates/snippets/modules/charts-convenios.html
View File

@ -28,19 +28,10 @@
<div class="module " style="height: 300px;">
<h2>Convênios</h2>
<div id="canvas-holder">
<canvas id="chart-area-1" width="120" height="120" />
<h3>Convênios assinados por projeto</h3>
<div id="canvas-holder-1">
<canvas id="chart-area-1" width="150" height="150" />
</div>
{# <div style="float: left">#}
{# <ul>#}
{# {% for num, dados in dados_graficos_convenio_projeto %}#}
{# {% for label, value, color in dados %}#}
{# <li style="list-style-type: none"><span style="background-color: {{ color }}; border-radius: 3px;">&nbsp&nbsp&nbsp</span> {{ label }}</li>#}
{# {% endfor %}#}
{# {% endfor %}#}
{# </ul>#}
{# </div>#}
{# <ul class="pie-legend"></ul>#}
</div>
<div class="module" style="height: 300px;">
@ -94,8 +85,9 @@
<div class="module" style="height: 300px;">
<h2>Convênios</h2>
<div id="canvas-holder" class="align-center" style="margin-top: 55px">
<canvas id="chart-area-2" width="220" height="220" />
<h3>Processos de convênios por projeto</h3>
<div id="canvas-holder-2" style="margin-top: 55px">
<canvas id="chart-area-2" width="150" height="150" />
</div>
</div>
@ -105,45 +97,5 @@
<div class="align-center">
<a href="/dashboard/mapa/"> <img src="{{ STATIC_URL }}img/mapicon-large.png" style="width: 60%;"/> </a>
</div>
{% comment %}
<h2>Metas BID</h2>
<h3>Estado das metas do contrato BID</h3>
<table style="margin: auto;">
{% for meta in metas %}
<tr>
<td><strong>{{ meta.titulo }}</strong></td>
<td>
<img src="//chart.googleapis.com/chart?chf=c,s,CDCDCD&chbh=a&chs=250x18&cht=bhs&chco={{ meta.saude }}&chd=t:{{ meta.percentual_concluido|stringformat:'d' }}&chm=r,00000034,0,{{ meta.percentual_desejado_low|stringformat:'f' }},{{ meta.percentual_desejado_high|stringformat:'f' }},1"
width="100%" alt="" />
</td>
<td style="text-align: center;"><font color="{{ meta.saude }}">{{ meta.percentual_concluido }}%</font></td>
</tr>
{% endfor %}
</table>
<div class="legend">
<span><div style="background-color: #E74A69;">&nbsp;</div>Ruim</span>
<span><div style="background-color: #FFDB6E;">&nbsp;</div>Preocupante</span>
<span><div style="background-color: #89D7AF;">&nbsp;</div>Bom</span>
<span><div style="background-color: #A2BBED;">&nbsp;</div>Atingido</span>
</div>
{% endcomment %}
</div>
{% comment %}
<div class="module" style="height: 300px;">
<h2>Diagnósticos</h2>
<h3>Resumo dos diagnósticos</h3>
<table style="display: block; float: left;">
{% for data in tabela_resumo_diagnostico %}
<tr>
<th>{{ data.title }}</th>
<td style="text-align: right;">{{ data.count }}</td>
</tr>
{% endfor %}
<tr><td colspan="2"><a href="/diagnosticos/mapa/">Ver mapa ampliado</a></td></tr>
</table>
<div id="map_canvas" style="float: left; height: 80%; width: 300px;">
</div>
</div>
{% endcomment %}

Write Preview
Loading…
Cancel
Save