Вчера я нашел этот приятный код для вывода индикатора температуры и режима работы климатической системы от Dal Hundal.
Поигравшись немного решил портировать его в Node red чтобы больше людей могли использовать его, без особых знаний в html и java-скрипт.
Это стало моим любимым виджетом термостата для моего домашнего контроля температуры в комнате
Полностью отзывчивый дизайн. Сенсорная кнопка делает его еще более прохладным. Нажмите и удерживайте палец, и он активирует заданную функцию скольжения.
Также он имеет несколько режимов отображения, как отопление, охлаждение и прочее. Это делает его более интуитивно понятным для пользователя.Есть прикольный листик режима ЭКО.
Попробуем перенести это в Node-red . Обмен данными основан на topic. Вы можете перемещать отдельные Payload с определенным Topic. Если вы измените заданную точку в веб-браузере, она вызовет обратный Payload на node-red с темой "target_temperature" и значением.
- ambient_temperature, target_temperature являются числовыми (21.5 ) .
- hvac_state является Строковой ( выключен, отопление, охлаждение ) .
- has_leave, away являются логическими (true, false )
Если вы знакомы с CSS и JAVA есть больше вещей, чтобы настроить, цвета, диапазоны и т.д.
Некоторые параметры в Java script:
options = {
diameter: options.diameter || 400,
minValue: options.minValue || 10, //минимальное значение целевой температуры
maxValue: options.maxValue || 30, //Максимальное значение целевой температуры
numTicks: options.numTicks || 200, //Количество тиковых линий отображаемых вокруг циферблата
onSetTargetTemperature: options.onSetTargetTemperature || function() {}, // Функция вызывается когда новое указание цели температуры установлена с интерфейса.
};
Виджет можно отобразить в любом месте страницы.Вы как раз должны включить div с ID термостата.
<div id= "Mythermostat"><div id= "Mythermostat" >< / div>
var nest = new thermostatDial(document.getElementById('Mythermostat')
Пользуйтесь на здоровье.