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

Migrando charts da home para Charts.js

producao
Breno Teixeira 11 years ago
parent
a76798d92b
commit
a632686e38
4 changed files with 167 additions and 118 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. 73
      sigi/context_processors.py
  2. 10
      sigiStatic/js/Chart.min.js
  3. 185
      templates/index.html
  4. 17
      templates/snippets/modules/charts-convenios.html

73
sigi/context_processors.py
View File

@ -1,12 +1,13 @@
#-*- coding:utf-8 -*-
from itertools import cycle
import datetime
from sigi.apps.casas.models import CasaLegislativa
from sigi.apps.convenios.models import Convenio, Projeto
from sigi.apps.servicos.models import TipoServico
from sigi.apps.diagnosticos.models import Diagnostico
from sigi.apps.metas.models import Meta
def charts_data(request):
"""
Busca informacoes para a criacao dos graficos e resumos
@ -18,17 +19,15 @@ def charts_data(request):
tabela_resumo_camara = busca_informacoes_camara()
tabela_resumo_seit = busca_informacoes_seit()
tabela_resumo_diagnostico = busca_informacoes_diagnostico()
g_conv_proj = grafico_convenio_projeto(convenios)
g_convassinado_proj = grafico_convenio_projeto(convenios_assinados)
return {
dados_graficos_convenio_projeto = [(1, grafico_convenio_projeto(convenios)),
(2, grafico_convenio_projeto(convenios_assinados))]
return {
'tabela_resumo_camara': tabela_resumo_camara,
'tabela_resumo_seit': tabela_resumo_seit,
'tabela_resumo_diagnostico': tabela_resumo_diagnostico,
'g_conv_proj': g_conv_proj,
"g_convassinado_proj": g_convassinado_proj,
'dados_graficos_convenio_projeto': dados_graficos_convenio_projeto,
'metas': Meta.objects.all(),
}
}
def busca_informacoes_camara():
@ -48,7 +47,7 @@ def busca_informacoes_camara():
convenios_com_aceite = convenios.exclude(data_termo_aceite=None)
camaras_sem_processo = camaras.filter(convenio=None)
camaras_sem_processo = camaras.filter(convenio=None)
# Criacao das listas para o resumo de camaras por projeto
@ -75,7 +74,7 @@ def busca_informacoes_camara():
lista_convenios_assinados.append(camaras.filter(convenio__in=conv_assinados_proj).count())
lista_convenios_em_andamento.append(camaras.filter(convenio__in=conv_em_andamento_proj).count())
lista_camaras_equipadas.append(camaras.filter(convenio__in=conv_equipadas_proj).count())
# Monta linhas de diagnosticos
lista_diagnosticos_digitados = ['', '', Diagnostico.objects.count()]
lista_diagnosticos_publicados = ['', '', Diagnostico.objects.filter(publicado=True).count()]
@ -108,25 +107,49 @@ def busca_informacoes_camara():
lista_zip = zip(cabecalho_esquerda,linhas)
# Retornando listas em forma de dicionario
return {
return {
u'cabecalho_topo': cabecalho_topo,
u'lista_zip': lista_zip,
u'total_camaras': camaras.count(),
u'camaras_sem_processo': camaras_sem_processo.count(),
}
}
def grafico_convenio_projeto(convenios):
colors = cycle(['#7cb5ec',
'#434348',
'#90ed7d',
'#f7a35c',
'#8085e9',
'#f15c80',
'#e4d354',
'#8085e8',
'#8d4653',
'#91e8e1', ])
# colors = cycle(base_colors)
highlights = cycle(['#B0D3F4',
'#8E8E91',
'#BCF4B1',
'#FAC89D',
'#B3B6F2',
'#F79DB3',
'#EFE598',
'#B3B6F1',
'#BB9098',
'#BDF1ED', ])
def grafico_convenio_projeto(convenios):
projetos = Projeto.objects.all()
lista_projetos = []
for projeto in projetos:
lista_projetos.append((projeto.nome, convenios.filter(projeto=projeto).count()))
total_convenios = "Total: " + str(convenios.count())
lista_projetos.insert(0, total_convenios)
lista_projetos = [(projeto.nome,
convenios.filter(projeto=projeto).count(),
colors.next(),
highlights.next())
for projeto in projetos]
# print lista_projetos
# total_convenios = "Total: " + str(convenios.count())
# lista_projetos.insert(0, total_convenios)
return lista_projetos
@ -138,14 +161,14 @@ def busca_informacoes_seit():
'total': 'Total de casas atendidas',
'novos_mes_anterior': 'Novas casas em %s/%s' % (mes_anterior.month, mes_anterior.year),
'novos_mes_atual': 'Novas casas em %s/%s' % (mes_atual.month, mes_atual.year)}]
for tipo_servico in TipoServico.objects.all():
result.append(
{'nome': tipo_servico.nome,
'total': tipo_servico.servico_set.filter(data_desativacao=None).count(),
'novos_mes_anterior': tipo_servico.servico_set.filter(data_desativacao=None, data_ativacao__year=mes_anterior.year, data_ativacao__month=mes_anterior.month).count(),
'novos_mes_atual': tipo_servico.servico_set.filter(data_desativacao=None, data_ativacao__year=mes_atual.year, data_ativacao__month=mes_atual.month).count(),
}
}
)
return result
@ -155,4 +178,4 @@ def busca_informacoes_diagnostico():
return [
{'title': 'Diagnósticos digitados', 'count': Diagnostico.objects.count()},
{'title': 'Diagnósticos publicados', 'count': Diagnostico.objects.filter(publicado=True).count()},
]
]

10
sigiStatic/js/Chart.min.js
View File

File diff suppressed because one or more lines are too long

185
templates/index.html
View File

@ -8,6 +8,7 @@
<script type="text/javascript" src="{{ STATIC_URL }}admin/js/core.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}admin/js/jquery.min.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}admin/js/jquery.init.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/Chart.min.js"></script>
<script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=false"> </script>
<script type="text/javascript">
(function($) {
@ -47,89 +48,111 @@
})
})(django.jQuery);
</script>
{# Highcharts scripts #}
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script type="text/javascript">
$(function () {
var chart;
$(document).ready(function () {
// Build the chart
$('#processos_conv').highcharts({
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'Processos de convênios por projeto <br/> {{ g_conv_proj.0 }}'
},
tooltip: {
pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: false
},
showInLegend: true
}
<script>
{% for num, dados in dados_graficos_convenio_projeto %}
var pieData{{ num }} = [
{% for label, value, color, highlight in dados %}
{# {% if not forloop.first %}#}
{
label: "{{ label }}",
value: {{ value }},
color:"{{ color }}",
highlight: "{{ highlight }}"
},
series: [{
type: 'pie',
name: 'Browser share',
data: [
{% for k, v in g_conv_proj %}
{% if not forloop.first %}
['{{ k }}', {{ v }}],
{% endif %}
{% endfor %}
]
}]
});
$('#processos_conv_ass').highcharts({
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'Convênios assinados por projeto <br/> {{ g_convassinado_proj.0 }}'
},
tooltip: {
pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: false
},
showInLegend: true
}
},
series: [{
type: 'pie',
name: 'Browser share',
data: [
{% for k, v in g_convassinado_proj %}
{% if not forloop.first %}
['{{ k }}', {{ v }}],
{% endif %}
{% endfor %}
]
}]
});
});
});
{# {% endif %}#}
{% endfor %}
]
window.onload = function(){
var ctx = document.getElementById("chart-area-1").getContext("2d");
window.myPie = new Chart(ctx).Pie(pieData1).generateLegend();
var ctx = document.getElementById("chart-area-2").getContext("2d");
window.myPie = new Chart(ctx).Pie(pieData2).generateLegend();
};
{% endfor %}
</script>
{# Highcharts scripts #}
{# <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>#}
{# <script src="http://code.highcharts.com/highcharts.js"></script>#}
{##}
{# <script type="text/javascript">#}
{# $(function () {#}
{# var chart;#}
{##}
{# $(document).ready(function () {#}
{##}
{# // Build the chart#}
{# $('#processos_conv').highcharts({#}
{# chart: {#}
{# plotBackgroundColor: null,#}
{# plotBorderWidth: null,#}
{# plotShadow: false#}
{# },#}
{# title: {#}
{# text: 'Processos de convênios por projeto <br/> {{ g_conv_proj.0 }}'#}
{# },#}
{# tooltip: {#}
{# pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'#}
{# },#}
{# plotOptions: {#}
{# pie: {#}
{# allowPointSelect: true,#}
{# cursor: 'pointer',#}
{# dataLabels: {#}
{# enabled: false#}
{# },#}
{# showInLegend: true#}
{# }#}
{# },#}
{# series: [{#}
{# type: 'pie',#}
{# name: 'Browser share',#}
{# data: [#}
{# {% for k, v in g_conv_proj %}#}
{# {% if not forloop.first %}#}
{# ['{{ k }}', {{ v }}],#}
{# {% endif %}#}
{# {% endfor %}#}
{# ]#}
{# }]#}
{# });#}
{# $('#processos_conv_ass').highcharts({#}
{# chart: {#}
{# plotBackgroundColor: null,#}
{# plotBorderWidth: null,#}
{# plotShadow: false#}
{# },#}
{# title: {#}
{# text: 'Convênios assinados por projeto <br/> {{ g_convassinado_proj.0 }}'#}
{# },#}
{# tooltip: {#}
{# pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'#}
{# },#}
{# plotOptions: {#}
{# pie: {#}
{# allowPointSelect: true,#}
{# cursor: 'pointer',#}
{# dataLabels: {#}
{# enabled: false#}
{# },#}
{# showInLegend: true#}
{# }#}
{# },#}
{# series: [{#}
{# type: 'pie',#}
{# name: 'Browser share',#}
{# data: [#}
{# {% for k, v in g_convassinado_proj %}#}
{# {% if not forloop.first %}#}
{# ['{{ k }}', {{ v }}],#}
{# {% endif %}#}
{# {% endfor %}#}
{# ]#}
{# }]#}
{# });#}
{# });#}
{##}
{# });#}
{# </script>#}
{# end highcharts scripts #}
{% endblock %}

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

@ -28,13 +28,10 @@
<div class="module" style="height: 300px;">
<h2>Convênios</h2>
<div id="processos_conv_ass" class="align-center" style="height: 280px;">
{% if g_convassinado_proj.convenios %}
<img src="{{ convenios_assinados.url }}&chdlp=b" class="chart" />
{% else %}
<p>Nenhum dado para exibir</p>
{% endif %}
<div id="canvas-holder" class="align-center" style="margin-top: 55px">
<canvas id="chart-area-1" width="220" height="220" />
</div>
<ul class="pie-legend"></ul>
</div>
<div class="module" style="height: 300px;">
@ -88,12 +85,8 @@
<div class="module" style="height: 300px;">
<h2>Convênios</h2>
<div id="processos_conv" class="align-center" style="height: 280px;">
{% if g_conv_proj.convenios %}
<img src="{{ processos.url }}&chdlp=b" class="chart" />
{% else %}
<p>Nenhum dado para exibir</p>
{% endif %}
<div id="canvas-holder" class="align-center" style="margin-top: 55px">
<canvas id="chart-area-2" width="220" height="220" />
</div>
</div>

Write Preview
Loading…
Cancel
Save