beielipi/web-root/scale.tpl

75 lines
2.1 KiB
Smarty

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="BeieliPi - Bienenstock-Monitoring">
<meta name="author" content="Joerg Lehmann, nbit Informatik GmbH">
<link rel="icon" href="/static/images/favicon.ico">
<title>BeieliPi - Messkurve f&uuml;r {{ scale_alias }}</title>
<script type="text/javascript" src="/static/js/dygraph.js"></script>
<link rel="stylesheet" src="/static/css/dygraph.css" />
<style type="text/css">
.dygraph-axis-label-x {
font-size: 10px;
}
* {
font-family: "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
}
#mylabel {
text-align: right;
font-size: 12px;
}
#graphdiv {
position: absolute;
left: 1%;
right: 1%;
top: 1%;
bottom: 1%;
}
</style>
</head>
<body>
<div id="mylabel"></div>
<div id="graphdiv"></div>
<script type="text/javascript">
g = new Dygraph(
document.getElementById("graphdiv"),
"/data/{{ scale_uuid }}-{{ infotime }}.csv",
{
title: '<b>{{ scale_alias }}</b>',
titleHeight: 36,
showRangeSelector: true,
rangeSelectorHeight: 40,
drawPoints: true,
pointSize: 2,
labels: [ 'Timestamp', 'Gewicht in Gramm' ],
labelsDiv: document.getElementById("mylabel"),
axes: {
x: {
pixelsPerLabel: 90,
axisLabelWidth: 90,
axisLabelFormatter: function(d, gran) {
return new Date(d).toLocaleString('de-CH').slice(0, -3);
},
valueFormatter: function(ms) {
return new Date(ms).toLocaleString('de-CH').slice(0, -3);
}
}
}
}
);
</script>
</body>
</html>