Re: [Модуль] Charts (charts)
Добавлено: Вт сен 22, 2020 10:06 am
Тренироваться со SteelSeries лучше всего в родной ветке форума и на Винде. Свой код могу выложить ночью. У меня так )
СпойлерПоказать
Код: Выделить всё
<html>
<body onload="init()">
<table width="100%" border="0">
<tr>
<td width="33%" align=center>
<a href="/module/charts.html?id=config&period=24h&property=Room.Temperature" onclick="window.open(this.href,'description','width=1500, height=400, toolbar=0');return false;"><h5>Температура в комнате</h5></a>
</td>
<td width="33%" align=center>
<a href="/module/charts.html?id=config&period=24h&property=Room.Humidity" onclick="window.open(this.href,'description','width=1500, height=400, toolbar=0');return false;"><h5>Влажность в комнате</h5></a>
</td>
<td width="33%" align=center>
<a href="/module/charts.html?id=config&period=24h&property=Room.Pressure" onclick="window.open(this.href,'description','width=1500, height=400, toolbar=0');return false;"><h5>Давление в комнате</h5></a>
</td>
</tr>
<tr>
<td width="33%" align=center>
<canvas id="canvastemp01" width="201" height="201"></canvas>
</td>
<td width="33%" align=center>
<canvas id="canvashumidity01" width="201" height="201"></canvas>
</td>
<td width="33%" align=center>
<canvas id="canvaspressure01" width="201" height="201"></canvas>
</td>
</tr>
<tr>
<td width="33%" align=center>
<a href="/module/charts.html?id=config&period=24h&property=ow_fact.temperature" onclick="window.open(this.href,'description','width=1500,height=400,resizable=no, scrollbars=yes');return false;"><h5>Температура на улице</h5></a>
</td>
<td width="33%" align=center>
<a href="/module/charts.html?id=config&period=24h&property=ow_fact.humidity" onclick="window.open(this.href,'description','width=1500,height=400,resizable=no, scrollbars=yes');return false;"><h5>Влажность на улице</h5></a>
</td>
<td width="33%" align=center>
<a href="/module/charts.html?id=config&period=24h&property=ow_fact.pressure_mmhg" onclick="window.open(this.href,'description','width=1500,height=400,resizable=no, scrollbars=yes');return false;"><h5>Давление на улице</h5></a>
</td>
</tr>
<tr>
<td width="33%" align=center>
<canvas id="canvasTempOutside" width="201" height="201"></canvas>
</td>
<td width="33%" align=center>
<canvas id="canvasHumidityOutside" width="201" height="201"></canvas>
</td>
<td width="33%" align=center>
<canvas id="canvasPressureOutside" width="201" height="201"></canvas>
</td>
</tr>
</table>
<script>
var scroll = false;
var temp01;
var humidity01;
var pressure01;
var TempOutside;
var HumidityOutside;
var PressureOutside;
function init() {
// Initialzing gauge
temp01 = new steelseries.Radial('canvastemp01', {
gaugeType: steelseries.GaugeType.TYPE4,
size: 300,
minValue:10,
maxValue:30,
titleString: "Температура",
unitString: "Градусы",
threshold: 20,
lcdVisible: true
});
humidity01 = new steelseries.Radial('canvashumidity01', {
gaugeType: steelseries.GaugeType.TYPE4,
size: 300,
minValue:0,
maxValue:100,
titleString: "Влажность",
unitString: "%",
threshold: 25,
lcdVisible: true
});
pressure01 = new steelseries.Radial('canvaspressure01', {
gaugeType: steelseries.GaugeType.TYPE4,
size: 300,
minValue:500,
maxValue:800,
titleString: "Атм давление",
unitString: "мм рт ст",
threshold: 735,
lcdVisible: true
});
TempOutside = new steelseries.Radial('canvasTempOutside', {
gaugeType: steelseries.GaugeType.TYPE4,
size: 300,
minValue:-40,
maxValue:40,
titleString: "Температура",
unitString: "Градусы",
threshold: 0,
lcdVisible: true
});
HumidityOutside = new steelseries.Radial('canvasHumidityOutside', {
gaugeType: steelseries.GaugeType.TYPE4,
size: 300,
minValue:0,
maxValue:100,
titleString: "Влажность",
unitString: "%",
threshold: 90,
lcdVisible: true
});
PressureOutside = new steelseries.Radial('canvasPressureOutside', {
gaugeType: steelseries.GaugeType.TYPE4,
size: 300,
minValue:700,
maxValue:800,
titleString: "Атм давление",
unitString: "мм рт ст",
threshold: 735,
lcdVisible: true
});
temp01.setBackgroundColor(steelseries.BackgroundColor.WHITE);
humidity01.setBackgroundColor(steelseries.BackgroundColor.WHITE);
pressure01.setBackgroundColor(steelseries.BackgroundColor.WHITE);
TempOutside.setBackgroundColor(steelseries.BackgroundColor.WHITE);
HumidityOutside.setBackgroundColor(steelseries.BackgroundColor.WHITE);
PressureOutside.setBackgroundColor(steelseries.BackgroundColor.WHITE);
// Start the update
setInterval(function(){ live_upd("/pChart/?op=value&p=Room.Temperature", temp01); },10000);
setInterval(function(){ live_upd("/pChart/?op=value&p=Room.Humidity", humidity01); },10000);
setInterval(function(){ live_upd("/pChart/?op=value&p=Room.Pressure", pressure01); },10000);
setInterval(function(){ live_upd("/pChart/?op=value&p=ow_fact.temperature", TempOutside);}, 10000);
setInterval(function(){ live_upd("/pChart/?op=value&p=ow_fact.humidity", HumidityOutside); },10000);
setInterval(function(){ live_upd("/pChart/?op=value&p=ow_fact.pressure_mmhg", PressureOutside); },10000);
}
function live_upd(url,gauge) {
$.ajax({
url: url,
}).done(function(data) {
if (data!='') {gauge.setValueAnimated(parseFloat(data));}
});
}
</script>
<script src="../SteelSeries/tween-min.js"></script>
<script src="../SteelSeries/steelseries-min.js"></script>
</body>
</html>
супер! сподвиг меня свою старую страницу на вебсокеты переписать)nick7zmail писал(а): ↑Вт сен 22, 2020 5:08 pmНу вот заставили меня моё сообщение искать))
https://mjdm.ru/forum/viewtopic.php?p=86342#p86342