jlusiardi
/
rollerverbrauch
1
0
Fork 0
Code Issues 2 Pull Requests Projects Releases 12 Wiki Activity

Worked on charts

This commit is contained in:
Joachim Lusiardi 2016-05-02 06:42:43 +02:00
parent 161cc16498
commit cc7d2620e8
5 changed files with 73 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
app/rollerverbrauch/filters.py
View File

@ -1,4 +1,5 @@
from rollerverbrauch import app from rollerverbrauch import app
import hashlib
@app.template_filter('none_filter') @app.template_filter('none_filter')
@ -7,3 +8,15 @@ def none_filter(value):
return '' return ''
else: else:
return value return value
@app.template_filter('md5')
def md5_filter(value):
m = hashlib.md5()
m.update(str(value).encode('UTF-8'))
return m.hexdigest()
@app.template_filter('str')
def str_filter(value):
return str(value)

8
app/rollerverbrauch/static/main.js
View File

@ -12,18 +12,18 @@ function createChart(id, data, unit) {
"axisAlpha": 0, "axisAlpha": 0,
"position": "left", "position": "left",
"ignoreAxisWidth":true, "ignoreAxisWidth":true,
"title": "Fuelled litres" // "title": unit
}], }],
"balloon": { "balloon": {
"borderThickness": 1, "borderThickness": 1,
"shadowAlpha": 10 "shadowAlpha": 10,
}, },
"graphs": [{ "graphs": [{
"id": "g1", "id": "g1",
"balloon":{ "balloon":{
"drop":true, "drop":true,
"adjustBorderColor":false, "adjustBorderColor":false,
"color":"#ffffff" "color":"#ffffff",
}, },
"bullet": "round", "bullet": "round",
"bulletBorderAlpha": 1, "bulletBorderAlpha": 1,
@ -31,7 +31,7 @@ function createChart(id, data, unit) {
"bulletSize": 5, "bulletSize": 5,
"hideBulletsCount": 50, "hideBulletsCount": 50,
"lineThickness": 2, "lineThickness": 2,
"title": "Fuelled litres", // "title": unit,
//"useLineColorForBulletBorder": true, //"useLineColorForBulletBorder": true,
"valueField": "value", "valueField": "value",
"balloonText": "<span style='font-size:18px;'>[[value]] "+unit+"</span>" "balloonText": "<span style='font-size:18px;'>[[value]] "+unit+"</span>"

28
app/rollerverbrauch/templates/layout.html
View File

@ -59,6 +59,31 @@
{% endmacro %} {% endmacro %}
{% macro chartScript(divId, data, unit)%}
{% set hash = divId | md5 %}
data_{{ hash }} = [{% for stop in data %}{
"date": "{{stop.date}}",
"value": {{stop.value}}
}{% if not loop.last %},{%endif%}
{% endfor%}
]
var chart_{{ hash }} = createChart('{{divId}}', data_{{ hash }}, '{{unit}}');
function zoom_chart_{{ hash }}() {
chart_{{ hash }}.zoomToIndexes(
chart_{{ hash }}.dataProvider.length - 40,
chart_{{ hash }}.dataProvider.length - 1
);
}
chart_{{ hash }}.addListener("rendered", zoom_chart_{{ hash }});
zoom_chart_{{ hash }}()
{% endmacro %}
<!doctype html> <!doctype html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]--> <!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]--> <!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]-->
@ -94,6 +119,9 @@
<!-- Latest compiled and minified JavaScript --> <!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="{{ url_for('static', filename='main.css') }}"> <link rel="stylesheet" href="{{ url_for('static', filename='main.css') }}">
<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="https://www.amcharts.com/lib/3/serial.js"></script>
<script src="https://www.amcharts.com/lib/3/themes/patterns.js"></script>
<script src="{{ url_for('static', filename='main.js') }}"></script> <script src="{{ url_for('static', filename='main.js') }}"></script>
</head> </head>
<body> <body>

50
app/rollerverbrauch/templates/statistics.html
View File

@ -57,10 +57,24 @@
</ul> </ul>
<div id="my-tab-content" class="tab-content"> <div id="my-tab-content" class="tab-content">
<div class="tab-pane active" id="v{{vehicle.id}}_c1"> <div class="tab-pane active" id="v{{vehicle.id}}_c1">
<div id="chartdiv1" style="width:100%; height:500px;"></div> {% if vehicle.pitstop_count > 0 %}
<div id="fuelledChartDiv{{vehicle.id}}" style="width:100%; height:500px;"></div>
<script type="text/javascript">
{{ chartScript('fuelledChartDiv'+vehicle.id|str, vehicle.litres, 'l') }}
</script>
{% else %}
not enough data.
{% endif %}
</div> </div>
<div class="tab-pane " id="v{{vehicle.id}}_c2"> <div class="tab-pane " id="v{{vehicle.id}}_c2">
<div id="chartdiv2" style="width:100%; height:500px;"></div> {% if vehicle.pitstop_count > 0 %}
<div id="odometerChartDiv{{vehicle.id}}" style="width:100%; height:500px;"></div>
<script type="text/javascript">
{{ chartScript('odometerChartDiv'+vehicle.id|str, vehicle.odometers, 'km') }}
</script>
{% else %}
not enough data.
{% endif %}
</div> </div>
</div> </div>
</div> </div>
@ -78,39 +92,7 @@
}); });
</script> </script>
<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="https://www.amcharts.com/lib/3/serial.js"></script>
<script src="https://www.amcharts.com/lib/3/themes/patterns.js"></script>
<script type="text/javascript">
data1 = [{% for stop in current_user.vehicles[0].pitstops %}{
"date": "{{stop.date}}",
"value": {{stop.litres}}
}{% if not loop.last %},{%endif%}
{% endfor%}
]
var chart1 = createChart('chartdiv1', data1, 'l');
chart1.addListener("rendered", zoomChart1);
zoomChart1();
function zoomChart1() {
chart1.zoomToIndexes(chart1.dataProvider.length - 40, chart1.dataProvider.length - 1);
}
data2 = [{% for stop in current_user.vehicles[0].pitstops %}{
"date": "{{stop.date}}",
"value": {{stop.odometer}}
}{% if not loop.last %},{%endif%}
{% endfor%}
]
var chart2 = createChart('chartdiv2', data2, 'km');
chart2.addListener("rendered", zoomChart2);
zoomChart2();
function zoomChart2() {
chart2.zoomToIndexes(chart2.dataProvider.length - 40, chart2.dataProvider.length - 1);
}
</script>
{% endblock %} {% endblock %}

12
app/rollerverbrauch/tools.py
View File

@ -11,10 +11,14 @@ class VehicleStats:
self.overall_litres = 0 self.overall_litres = 0
self.average_litres_fuelled = 0 self.average_litres_fuelled = 0
self.average_litres_used = 0 self.average_litres_used = 0
self.pitstops = vehicle.pitstops self.litres = []
self.odometers = []
if self.pitstop_count > 0: if self.pitstop_count > 0:
for pitstop in vehicle.pitstops: for pitstop in vehicle.pitstops:
self.overall_litres += pitstop.litres self.overall_litres += pitstop.litres
self.litres.append(StatsEvent(pitstop.date, pitstop.litres))
self.odometers.append(StatsEvent(pitstop.date, pitstop.odometer))
self.average_litres_fuelled = self.overall_litres / self.pitstop_count self.average_litres_fuelled = self.overall_litres / self.pitstop_count
if self.pitstop_count > 1: if self.pitstop_count > 1:
self.overall_distance = vehicle.pitstops[-1].odometer - vehicle.pitstops[0].odometer self.overall_distance = vehicle.pitstops[-1].odometer - vehicle.pitstops[0].odometer
@ -22,6 +26,12 @@ class VehicleStats:
self.average_litres_used = 100 * (self.overall_litres - vehicle.pitstops[0].litres) / self.overall_distance self.average_litres_used = 100 * (self.overall_litres - vehicle.pitstops[0].litres) / self.overall_distance
class StatsEvent:
def __init__(self, date, value):
self.date = date
self.value = value
def db_log_add(entity): def db_log_add(entity):
logging.info('db_add: %s' % str(entity)) logging.info('db_add: %s' % str(entity))