Urls.py has been modified according to http://www.siteduzero.com/tutoriel-3-700629-organiser-proprement-vos-urls.html and bar chart has been added to /cards/charts.html

This commit is contained in:
Fred Pauchet 2012-11-23 16:52:48 +01:00
parent 4869cf9814
commit 8639662831
5 changed files with 229 additions and 22 deletions

View File

@ -37,7 +37,7 @@ def charts(request):
c = Country.objects.annotate(num_cards=Count('card'))
context = {'countries' : c }
context = {'countries': c, 'c_string': ', '.join(("'" + x.label + "'" for x in c)) }
return render_to_response('cards/charts.html', RequestContext(request, context))

View File

@ -46,6 +46,5 @@
{% block main_container %}{% endblock %}
</div>
</div>
</footer>
</body>
</html>

View File

@ -0,0 +1,139 @@
{% extends 'base.html' %}
{% load image_tags %}
{% block main_container %}
<script type="text/javascript" src="{{ STATIC_URL }}js/highcharts.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/modules/exporting.js"></script>
<script type="text/javascript">
$(function () {
var chart;
var barChat;
$(document).ready(function() {
Highcharts.setOptions({
colors: ['#058DC7', '#50B432', '#ED561B', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263', '#6AF9C4']
});
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'Nombre de cartes par pays'
},
tooltip: {
pointFormat: '{series.name}: <b>{point.percentage}%</b>',
percentageDecimals: 1
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#000000',
connectorColor: '#000000',
formatter: function() {
return '<b>'+ this.point.name +'</b>: '+ this.percentage.toFixed(2) +' %';
}
}
}
},
series: [{
type: 'pie',
name: 'Browser share',
data: [
{% for country in countries %}
['{{country.label}}', {{country.num_cards}}],
{% endfor %}
]
}]
});
barChart = new HighCharts.Chart({
renderTo: 'barContainer',
chart: {
type: 'bar'
},
title: {
text: 'Historic World Population by Region'
},
subtitle: {
text: 'Source: Wikipedia.org'
},
xAxis: {
categories: ['Africa', 'America', 'Asia', 'Europe', 'Oceania'],
title: {
text: null
}
},
yAxis: {
min: 0,
title: {
text: 'Population (millions)',
align: 'high'
},
labels: {
overflow: 'justify'
}
},
tooltip: {
formatter: function() {
return ''+
this.series.name +': '+ this.y +' millions';
}
},
plotOptions: {
bar: {
dataLabels: {
enabled: true
}
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -100,
y: 100,
floating: true,
borderWidth: 1,
backgroundColor: '#FFFFFF',
shadow: true
},
credits: {
enabled: false
},
series: [{
name: 'Year 1800',
data: [107, 31, 635, 203, 2]
}, {
name: 'Year 1900',
data: [133, 156, 947, 408, 6]
}, {
name: 'Year 2008',
data: [973, 914, 4054, 732, 34]
}]
});
});
});
</script>
<h2>Stats, tout ça</h2>
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto">
</div>
<div id="barContainer" style="min-width: 400px; height: 400px; margin: 0 auto">
</div>
{% endblock %}

View File

@ -5,12 +5,16 @@
{% block main_container %}
<script type="text/javascript" src="{{ STATIC_URL }}js/highcharts.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/modules/highcharts.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/modules/exporting.js"></script>
<script type="text/javascript">
$(function () {
var chart;
var chart;
var barChart;
$(document).ready(function() {
Highcharts.setOptions({
colors: ['#058DC7', '#50B432', '#ED561B', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263', '#6AF9C4']
});
@ -43,9 +47,12 @@
}
}
},
credits: {
enabled: false
},
series: [{
type: 'pie',
name: 'Browser share',
name: 'CardsCountry',
data: [
{% for country in countries %}
['{{country.label}}', {{country.num_cards}}],
@ -53,8 +60,63 @@
]
}]
});
});
});
barchart = new Highcharts.Chart({
chart: {
renderTo: 'barcontainer',
type: 'bar'
},
title: {
text: ''
},
xAxis: {
categories: [{{c_string|safe}}],
title: {
text: null
}
},
yAxis: {
min: 0,
title: {
text: 'Nombre de cartes (unités)',
align: 'high'
},
labels: {
overflow: 'justify'
}
},
plotOptions: {
bar: {
dataLabels: {
enabled: false
}
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -100,
y: 100,
floating: true,
borderWidth: 1,
backgroundColor: '#FFFFFF',
shadow: true
},
credits: {
enabled: false
},
series: [{
name: 'Nombre de cartes',
data: [
{% for country in countries %}
{{country.num_cards}},
{% endfor %}
]
}]
});
});
});
</script>
<h2>Stats, tout ça</h2>
@ -63,4 +125,8 @@
</div>
<div id="barcontainer" style="min-width: 400px; height: 400px; margin: 0 auto">
</div>
{% endblock %}

33
urls.py
View File

@ -5,27 +5,30 @@ from django.contrib.staticfiles.urls import staticfiles_urlpatterns
from django.contrib import admin
admin.autodiscover()
urlpatterns = patterns('',
urlpatterns = patterns('cards.views',
# Examples:
# url(r'^$', 'xcards.views.home', name='home'),
# url(r'^xcards/', include('xcards.foo.urls')),
url(r'^details/(?P<card_id>\d+)/$', 'cards.views.details', name='card-details'),
url(r'^query/$', 'cards.views.query'),
url(r'^advanced-query/$', 'cards.views.advanced_query', name='advanced-query'),
url(r'^list/country/(?P<country_id>\d+)/$', 'cards.views.search_by_country', name='list-by-country'),
url(r'^list/category/(?P<category_id>\d+)/$', 'cards.views.search_by_category', name='list-by-category'),
url(r'^list/subcategory/(?P<subcategory_id>\d+)/$', 'cards.views.search_by_subcategory', name='list-by-subcategory'),
url(r'^list/tag/(?P<tag_id>\d+)/$', 'cards.views.search_by_tag', name='list-by-tag'),
url(r'^charts/$', 'cards.views.charts', name='charts'),
url(r'^map/$', 'osm.views.map', name='map'),
url(r'^admin/doc/', include('django.contrib.admindocs.urls')),
url(r'^details/(?P<card_id>\d+)/$', 'details', name='card-details'),
url(r'^query/$', 'query'),
url(r'^advanced-query/$', 'advanced_query', name='advanced-query'),
url(r'^list/country/(?P<country_id>\d+)/$', 'search_by_country', name='list-by-country'),
url(r'^list/category/(?P<category_id>\d+)/$', 'search_by_category', name='list-by-category'),
url(r'^list/subcategory/(?P<subcategory_id>\d+)/$', 'search_by_subcategory', name='list-by-subcategory'),
url(r'^list/tag/(?P<tag_id>\d+)/$', 'search_by_tag', name='list-by-tag'),
url(r'^charts/$', 'charts', name='charts'),
url(r'^$', 'index', name='index'),
)
urlpatterns += patterns('osm.views',
url(r'^map/$', 'map', name='map'),
)
urlpatterns += patterns('',
url(r'^admin/doc/', include('django.contrib.admindocs.urls')),
url(r'^admin/', include(admin.site.urls)),
(r'^media/(?P<path>.*)$', 'django.views.static.serve', {'document_root': settings.MEDIA_ROOT}),
url(r'^$', 'cards.views.index', name='index'),
(r'^media/(?P<path>.*)$', 'django.views.static.serve', {'document_root': settings.MEDIA_ROOT}),
)
urlpatterns += staticfiles_urlpatterns()