Worked on charts
This commit is contained in:
@@ -57,13 +57,27 @@
|
||||
</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>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</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 %}
|
||||
|
||||
Reference in New Issue
Block a user