Worked on charts
This commit is contained in:
parent
161cc16498
commit
cc7d2620e8
|
@ -1,4 +1,5 @@
|
|||
from rollerverbrauch import app
|
||||
import hashlib
|
||||
|
||||
|
||||
@app.template_filter('none_filter')
|
||||
|
@ -7,3 +8,15 @@ def none_filter(value):
|
|||
return ''
|
||||
else:
|
||||
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)
|
||||
|
|
|
@ -12,18 +12,18 @@ function createChart(id, data, unit) {
|
|||
"axisAlpha": 0,
|
||||
"position": "left",
|
||||
"ignoreAxisWidth":true,
|
||||
"title": "Fuelled litres"
|
||||
// "title": unit
|
||||
}],
|
||||
"balloon": {
|
||||
"borderThickness": 1,
|
||||
"shadowAlpha": 10
|
||||
"shadowAlpha": 10,
|
||||
},
|
||||
"graphs": [{
|
||||
"id": "g1",
|
||||
"balloon":{
|
||||
"drop":true,
|
||||
"adjustBorderColor":false,
|
||||
"color":"#ffffff"
|
||||
"color":"#ffffff",
|
||||
},
|
||||
"bullet": "round",
|
||||
"bulletBorderAlpha": 1,
|
||||
|
@ -31,7 +31,7 @@ function createChart(id, data, unit) {
|
|||
"bulletSize": 5,
|
||||
"hideBulletsCount": 50,
|
||||
"lineThickness": 2,
|
||||
"title": "Fuelled litres",
|
||||
// "title": unit,
|
||||
//"useLineColorForBulletBorder": true,
|
||||
"valueField": "value",
|
||||
"balloonText": "<span style='font-size:18px;'>[[value]] "+unit+"</span>"
|
||||
|
|
|
@ -59,6 +59,31 @@
|
|||
{% 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>
|
||||
<!--[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]-->
|
||||
|
@ -94,6 +119,9 @@
|
|||
<!-- Latest compiled and minified JavaScript -->
|
||||
<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') }}">
|
||||
<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>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
@ -57,10 +57,24 @@
|
|||
</ul>
|
||||
<div id="my-tab-content" class="tab-content">
|
||||
<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 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>
|
||||
|
@ -78,39 +92,7 @@
|
|||
});
|
||||
|
||||
</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 %}
|
||||
|
|
|
@ -11,10 +11,14 @@ class VehicleStats:
|
|||
self.overall_litres = 0
|
||||
self.average_litres_fuelled = 0
|
||||
self.average_litres_used = 0
|
||||
self.pitstops = vehicle.pitstops
|
||||
self.litres = []
|
||||
self.odometers = []
|
||||
|
||||
if self.pitstop_count > 0:
|
||||
for pitstop in vehicle.pitstops:
|
||||
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
|
||||
if self.pitstop_count > 1:
|
||||
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
|
||||
|
||||
|
||||
class StatsEvent:
|
||||
def __init__(self, date, value):
|
||||
self.date = date
|
||||
self.value = value
|
||||
|
||||
|
||||
def db_log_add(entity):
|
||||
logging.info('db_add: %s' % str(entity))
|
||||
|
||||
|
|
Loading…
Reference in New Issue