Шаблон класса / Class Template
Модератор: immortal
- nick7zmail
- Сообщения: 7573
- Зарегистрирован: Пн окт 28, 2013 8:14 am
- Откуда: Екатеринбург
- Благодарил (а): 121 раз
- Поблагодарили: 2010 раз
Re: Шаблон класса / Class Template
Я половину вопроса решил. Приконектился к вебсокету.
Осталось у Сергея выпытать как подписаться на обновление из яваскрипта)). Уже достал поди его.
Осталось у Сергея выпытать как подписаться на обновление из яваскрипта)). Уже достал поди его.
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
- tarasfrompir
- Сообщения: 3216
- Зарегистрирован: Ср мар 02, 2016 8:18 pm
- Откуда: Украина Пирятин
- Благодарил (а): 223 раза
- Поблагодарили: 816 раз
- nick7zmail
- Сообщения: 7573
- Зарегистрирован: Пн окт 28, 2013 8:14 am
- Откуда: Екатеринбург
- Благодарил (а): 121 раз
- Поблагодарили: 2010 раз
Re: Шаблон класса / Class Template
Конечно.
Отправлено с моего Xperia XZ1 Compact через Tapatalk
Отправлено с моего Xperia XZ1 Compact через Tapatalk
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
- nick7zmail
- Сообщения: 7573
- Зарегистрирован: Пн окт 28, 2013 8:14 am
- Откуда: Екатеринбург
- Благодарил (а): 121 раз
- Поблагодарили: 2010 раз
Re: Шаблон класса / Class Template
Делюсь)) Правда немного в другой теме, но суть - всё работает))
https://majordomo.smartliving.ru/forum/ ... 328#p86328
https://majordomo.smartliving.ru/forum/ ... 328#p86328
- За это сообщение автора nick7zmail поблагодарил:
- tarasfrompir (Вс сен 02, 2018 12:13 pm)
- Рейтинг: 1.16%
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
- tarasfrompir
- Сообщения: 3216
- Зарегистрирован: Ср мар 02, 2016 8:18 pm
- Откуда: Украина Пирятин
- Благодарил (а): 223 раза
- Поблагодарили: 816 раз
Re: Шаблон класса / Class Template
Плохо поделился - в примере чего нибудь можна ?nick7zmail писал(а): ↑Вс сен 02, 2018 9:27 amДелюсь)) Правда немного в другой теме, но суть - всё работает))
https://majordomo.smartliving.ru/forum/ ... 328#p86328
Ато я только так хоть что то разберу ...
Я то понял что темп1 и есть та переменная в которую все попадает , но хоть для более глубокого понимания можна что то показать
Спасибо нам ПОМОЖЕТ..!
- nick7zmail
- Сообщения: 7573
- Зарегистрирован: Пн окт 28, 2013 8:14 am
- Откуда: Екатеринбург
- Благодарил (а): 121 раз
- Поблагодарили: 2010 раз
Re: Шаблон класса / Class Template
Ну я максимально коротко и по делу постарался....для виджетов на сценах - первая часть того сообщения отпадает, т.к. вебсокеты в сценах уже подключены. Остаётся только 2-я часть. Вот пример индикатора подключенного через %Объект.свойство% и его сравнение с таким же индикатором через сокеты.
Вот код первого
и второго
ну так, для сравнения. Для работы надо скачать файлики steelseries.min и tween-min из темы с оформлениями.
Так хоть понятнее стало?))
Сори за качество но пришлось его сильно урезать, чтобы гифку вставить. А теперь угадай где какой)))Вот код первого
СпойлерПоказать
Код: Выделить всё
<table>
<tbody>
<tr>
<td width="100%">
<canvas id="canvasRadial4" width="201" height="201"></canvas>
</td>
</tr>
</tbody></table>
<script>
var radial4;
init2();
function init2() {
// Define some sections
var sections = [steelseries.Section(0, 25, 'rgba(0, 0, 220, 0.3)'),
steelseries.Section(25, 50, 'rgba(0, 220, 0, 0.3)'),
steelseries.Section(50, 75, 'rgba(220, 220, 0, 0.3)') ],
// Define one area
areas = [steelseries.Section(75, 100, 'rgba(220, 0, 0, 0.3)')],
// Define value gradient for bargraph
valGrad = new steelseries.gradientWrapper( 0,
100,
[ 0, 0.33, 0.66, 0.85, 1],
[ new steelseries.rgbaColor(0, 0, 200, 1),
new steelseries.rgbaColor(0, 200, 0, 1),
new steelseries.rgbaColor(200, 200, 0, 1),
new steelseries.rgbaColor(200, 0, 0, 1),
new steelseries.rgbaColor(200, 0, 0, 1) ]);
radial4 = new steelseries.Radial('canvasRadial4', {
gaugeType: steelseries.GaugeType.TYPE4,
size: 201,
section: sections,
area: areas,
titleString: "Title",
unitString: "Type4",
threshold: 50,
lcdVisible: true
});
radial4.setValueAnimated(%Sensor_humidity02.value%);
}
</script>
СпойлерПоказать
Код: Выделить всё
<table>
<tbody>
<tr>
<td width="100%">
<canvas id="canvasRadial3" width="201" height="201"></canvas>
</td>
</tr>
</tbody></table>
<script language='javascript'>
$.subscribe('wsConnected', function (_) {
var payload;
payload = new Object();
payload.action = 'Subscribe';
payload.data = new Object();
payload.data.TYPE='properties';
payload.data.PROPERTIES='sensor_humidity02.value';
wsSocket.send(JSON.stringify(payload));
});
function processPropertiesUpdate(data) {
var obj=jQuery.parseJSON(data);
var objCnt = obj.length;
if (objCnt) {
for(var i=0;i<objCnt;i++) {
if (obj[i]['PROPERTY']=='sensor_humidity02.value') {
rad3val=obj[i]['VALUE'];
radial3.setValueAnimated(obj[i]['VALUE']);
$.publish('sensor_humidity02.value.updated', obj[i]['VALUE']);}
}
}
}$.subscribe('wsData', function (_, response) {
if (response.action=='properties') {
processPropertiesUpdate(response.data);
}
});
</script>
<script>
var radial3;
var rad3val;
init();
function init() {
// Define some sections
var sections = [steelseries.Section(0, 25, 'rgba(0, 0, 220, 0.3)'),
steelseries.Section(25, 50, 'rgba(0, 220, 0, 0.3)'),
steelseries.Section(50, 75, 'rgba(220, 220, 0, 0.3)') ],
// Define one area
areas = [steelseries.Section(75, 100, 'rgba(220, 0, 0, 0.3)')],
// Define value gradient for bargraph
valGrad = new steelseries.gradientWrapper( 0,
100,
[ 0, 0.33, 0.66, 0.85, 1],
[ new steelseries.rgbaColor(0, 0, 200, 1),
new steelseries.rgbaColor(0, 200, 0, 1),
new steelseries.rgbaColor(200, 200, 0, 1),
new steelseries.rgbaColor(200, 0, 0, 1),
new steelseries.rgbaColor(200, 0, 0, 1) ]);
radial3 = new steelseries.Radial('canvasRadial3', {
gaugeType: steelseries.GaugeType.TYPE4,
size: 201,
section: sections,
area: areas,
titleString: "Title",
unitString: "Type4",
threshold: 50,
lcdVisible: true
});
}
function setRandomValue(gauge, range) {
gauge.setValueAnimated(Math.random() * range);
}
</script>
<script src="/js/tween-min.js"></script>
<script src="/js/steelseries-min.js"></script>
Так хоть понятнее стало?))
- За это сообщение автора nick7zmail поблагодарили (всего 3):
- tarasfrompir (Вс сен 02, 2018 8:10 pm) • Chainik (Пн сен 03, 2018 7:15 am) • samolet (Вт сен 22, 2020 8:50 pm)
- Рейтинг: 3.49%
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
- tarasfrompir
- Сообщения: 3216
- Зарегистрирован: Ср мар 02, 2016 8:18 pm
- Откуда: Украина Пирятин
- Благодарил (а): 223 раза
- Поблагодарили: 816 раз
Re: Шаблон класса / Class Template
Сделал как все написано - неподнялось - не отображает метрометраnick7zmail писал(а): ↑Вс сен 02, 2018 3:45 pmНу я максимально коротко и по делу постарался....для виджетов на сценах - первая часть того сообщения отпадает, т.к. вебсокеты в сценах уже подключены. Остаётся только 2-я часть. Вот пример индикатора подключенного через %Объект.свойство% и его сравнение с таким же индикатором через сокеты.
ScreenCaptureProject3_1.gif
Сори за качество но пришлось его сильно урезать, чтобы гифку вставить. А теперь угадай где какой)))
Вот код первогои второгоСпойлерПоказатьКод: Выделить всё
<table> <tbody> <tr> <td width="100%"> <canvas id="canvasRadial4" width="201" height="201"></canvas> </td> </tr> </tbody></table> <script> var radial4; init2(); function init2() { // Define some sections var sections = [steelseries.Section(0, 25, 'rgba(0, 0, 220, 0.3)'), steelseries.Section(25, 50, 'rgba(0, 220, 0, 0.3)'), steelseries.Section(50, 75, 'rgba(220, 220, 0, 0.3)') ], // Define one area areas = [steelseries.Section(75, 100, 'rgba(220, 0, 0, 0.3)')], // Define value gradient for bargraph valGrad = new steelseries.gradientWrapper( 0, 100, [ 0, 0.33, 0.66, 0.85, 1], [ new steelseries.rgbaColor(0, 0, 200, 1), new steelseries.rgbaColor(0, 200, 0, 1), new steelseries.rgbaColor(200, 200, 0, 1), new steelseries.rgbaColor(200, 0, 0, 1), new steelseries.rgbaColor(200, 0, 0, 1) ]); radial4 = new steelseries.Radial('canvasRadial4', { gaugeType: steelseries.GaugeType.TYPE4, size: 201, section: sections, area: areas, titleString: "Title", unitString: "Type4", threshold: 50, lcdVisible: true }); radial4.setValueAnimated(%Sensor_humidity02.value%); } </script>
ну так, для сравнения. Для работы надо скачать файлики steelseries.min и tween-min из темы с оформлениями.СпойлерПоказатьКод: Выделить всё
<table> <tbody> <tr> <td width="100%"> <canvas id="canvasRadial3" width="201" height="201"></canvas> </td> </tr> </tbody></table> <script language='javascript'> $.subscribe('wsConnected', function (_) { var payload; payload = new Object(); payload.action = 'Subscribe'; payload.data = new Object(); payload.data.TYPE='properties'; payload.data.PROPERTIES='sensor_humidity02.value'; wsSocket.send(JSON.stringify(payload)); }); function processPropertiesUpdate(data) { var obj=jQuery.parseJSON(data); var objCnt = obj.length; if (objCnt) { for(var i=0;i<objCnt;i++) { if (obj[i]['PROPERTY']=='sensor_humidity02.value') { rad3val=obj[i]['VALUE']; radial3.setValueAnimated(obj[i]['VALUE']); $.publish('sensor_humidity02.value.updated', obj[i]['VALUE']);} } } }$.subscribe('wsData', function (_, response) { if (response.action=='properties') { processPropertiesUpdate(response.data); } }); </script> <script> var radial3; var rad3val; init(); function init() { // Define some sections var sections = [steelseries.Section(0, 25, 'rgba(0, 0, 220, 0.3)'), steelseries.Section(25, 50, 'rgba(0, 220, 0, 0.3)'), steelseries.Section(50, 75, 'rgba(220, 220, 0, 0.3)') ], // Define one area areas = [steelseries.Section(75, 100, 'rgba(220, 0, 0, 0.3)')], // Define value gradient for bargraph valGrad = new steelseries.gradientWrapper( 0, 100, [ 0, 0.33, 0.66, 0.85, 1], [ new steelseries.rgbaColor(0, 0, 200, 1), new steelseries.rgbaColor(0, 200, 0, 1), new steelseries.rgbaColor(200, 200, 0, 1), new steelseries.rgbaColor(200, 0, 0, 1), new steelseries.rgbaColor(200, 0, 0, 1) ]); radial3 = new steelseries.Radial('canvasRadial3', { gaugeType: steelseries.GaugeType.TYPE4, size: 201, section: sections, area: areas, titleString: "Title", unitString: "Type4", threshold: 50, lcdVisible: true }); } function setRandomValue(gauge, range) { gauge.setValueAnimated(Math.random() * range); } </script> <script src="/js/tween-min.js"></script> <script src="/js/steelseries-min.js"></script>
Так хоть понятнее стало?))
Спасибо нам ПОМОЖЕТ..!
-
- Сообщения: 1463
- Зарегистрирован: Вс янв 10, 2016 11:05 am
- Благодарил (а): 260 раз
- Поблагодарили: 454 раза
Re: Шаблон класса / Class Template
Подтверждаю - не отображает.
Файлы steelseries-min.js и tween-min.js в \htdocs\js\ положил.
Объект sensor_humidity02 со свойством value создал. Значение свойства value вписал.
Не "взлетело". Что может быть не доделано?
Файлы steelseries-min.js и tween-min.js в \htdocs\js\ положил.
Объект sensor_humidity02 со свойством value создал. Значение свойства value вписал.
Не "взлетело". Что может быть не доделано?
- nick7zmail
- Сообщения: 7573
- Зарегистрирован: Пн окт 28, 2013 8:14 am
- Откуда: Екатеринбург
- Благодарил (а): 121 раз
- Поблагодарили: 2010 раз
Re: Шаблон класса / Class Template
Всё вписали в html блок? Или что-то в "дополнительный яваскрипт код"? Туда ничего не надо вписывать. Всё только в основное поле состояния.
И я так...просто ради примера накидал...не обязательно повторять...можно в своём чём нить пробовать))
И я так...просто ради примера накидал...не обязательно повторять...можно в своём чём нить пробовать))
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
- tarasfrompir
- Сообщения: 3216
- Зарегистрирован: Ср мар 02, 2016 8:18 pm
- Откуда: Украина Пирятин
- Благодарил (а): 223 раза
- Поблагодарили: 816 раз
Re: Шаблон класса / Class Template
https://canvas-gauges.com/documentation/examples/ даже это пробую прикрутить пока что с аниме - нифиге
Спасибо нам ПОМОЖЕТ..!