Страница 7 из 39
Re: визуализация данных
Добавлено: Пн дек 26, 2016 10:24 am
serghei
nick7zmail писал(а):
Если я правильно помню, за прозрачность отвечает последняя цифра в
Попробуйте поменять на 0 или 0.5 .
Эта функция дает красивый эффект ,но не то. При 0.3 появляются 4 убывающих секундных стрелки . Такое ощущение ,что при переходе стрелки на новое место старое не подчищается ( убывает прозрачность). Ищу дальше.
*** Сообщение запрещено. Сообщение похоже на спам. ***
Re: визуализация данных
Добавлено: Пн дек 26, 2016 12:30 pm
alexsis_76
Файл примера rgba.js
script/context2d/scripts/rgba.js
var ctx = document.getElementById('tutorial').getContext('2d');
// Рисуем фон
ctx.fillStyle = 'rgb(255,221,0)';
ctx.fillRect(0,0,150,37.5);
ctx.fillStyle = 'rgb(102,204,0)';
ctx.fillRect(0,37.5,150,37.5);
ctx.fillStyle = 'rgb(0,153,255)';
ctx.fillRect(0,75,150,37.5);
ctx.fillStyle = 'rgb(255,51,0)';
ctx.fillRect(0,112.5,150,37.5);
// Рисуем полупрозрачные прямоугольники
for (i=0;i<10;i++){
ctx.fillStyle = 'rgba(255,255,255,'+(i+1)/10+')';
for (j=0;j<4;j++){
ctx.fillRect(5+i*14,5+j*37.5,14,27.5)
}
}
Re: визуализация данных
Добавлено: Чт дек 29, 2016 3:23 am
alexsis_76
такие часы не устроят

- Безымянный_222.JPG (216.67 КБ) 7323 просмотра
вот интересно
http://jsgadget.ru/jsmeter.html
Re: визуализация данных
Добавлено: Чт дек 29, 2016 9:04 am
serghei
Отлично! Но у меня проблема возникает с " оберткой". Я 3 месяца просил объяснить как привязать показания переменных из скетча к стрелке спидометра. Пока не вспомнил, что еще полгода назад скачал Gauge как будто специально написанные для АМС без всяких внешних прибабахов ). Когда оставил чистый HTM, вопрос закрылся.
Теперь двигаясь дальше , "возникла" другая проблема - как привязать нажатие кнопки на экране к скетчу - надо при нажатии отправить код , что бы АМС выполнил команду . Саму кнопку создать оказалось очень просто ( из готового кода), а вот дальше....
Ну и всем фанатам Pink Floyd посвящается ( 44 года вечной музыке). Все средствами CSS. Картинка живая. Заготовка на будущее.

- PF__73.png (332.22 КБ) 7292 просмотра
Re: визуализация данных
Добавлено: Чт дек 29, 2016 1:34 pm
alexsis_76
ну это совсем просто
создаешь кнопку,при нажатии контроллеру отправляется запрос,его нужно распарсить и выполнить требуемое
для кнопки можно обработать событие ONCLICK,либо традиционным способом
<form action="demo.cgi" method="get">
<button type="submit" value="Submit">Отправить</button>
</form>
вот сам парсер
void parseRequest(EthernetClient cl) {
allowMarkers = false;
// index request
if (StrContains(HTTP_req, "GET / ") || StrContains(HTTP_req, "GET /index.htm")) {
if (openIndexFile(partSuffix(currentDesign))) {sendHtmlAnswer(cl);} else {webFile = SD.open(F("404.htm"));}
allowMarkers = true;
}
else if (StrContains(HTTP_req, GET)) {
// files requests
if (StrContains(HTTP_req, HTM_EXT)) {if (openWebFile()) {sendHtmlAnswer(cl);} else {webFile = SD.open(F("404.htm"));} allowMarkers = true;}
else if (StrContains(HTTP_req, ".css")) {if (openWebFile()) {sendCssAnswer(cl);} else {sendErrorAnswer("", cl);}}
else if (StrContains(HTTP_req, ".js")) {if (openWebFile()) {sendJsAnswer(cl);} else {sendErrorAnswer("", cl);}}
else if (StrContains(HTTP_req, ".pde")) {if (openWebFile()) {sendJsAnswer(cl);} else {sendErrorAnswer("", cl);}}
else if (StrContains(HTTP_req, ".png")) {if (openWebFile()) {sendPngAnswer(cl);} else {sendErrorAnswer("", cl);}}
else if (StrContains(HTTP_req, ".jpg")) {if (openWebFile()) {sendJpgAnswer(cl);} else {sendErrorAnswer("", cl);}}
else if (StrContains(HTTP_req, ".gif")) {if (openWebFile()) {sendGifAnswer(cl);} else {sendErrorAnswer("", cl);}}
else if (StrContains(HTTP_req, ".ico")) {if (openWebFile()) {sendIcoAnswer(cl);} else {sendErrorAnswer("", cl);}}
// Ajax requests
else if (StrContains(HTTP_req, "request_dash")) {sendXmlAnswer(cl); checkPage(); responseDash(cl);}
else if (StrContains(HTTP_req, "request_generic")) {sendXmlAnswer(cl); setLeds(); responseGeneric(cl);}
else if (StrContains(HTTP_req, "request_settings")){sendXmlAnswer(cl); setSettings(); responseSettings(cl);}
else if (StrContains(HTTP_req, "request_themes")) {sendXmlAnswer(cl); setTheme(); responseThemes(cl);}
else if (StrContains(HTTP_req, "request_control")) {sendXmlAnswer(cl); setControl(); responseControl(cl);}
else if (StrContains(HTTP_req, "request_noo")) {sendXmlAnswer(cl); setNoo(); responseNoo(cl);}
else if (StrContains(HTTP_req, "request_mr1132")) {sendXmlAnswer(cl); setMr1132(); responseMr1132(cl);}
else if (StrContains(HTTP_req, "req_el_control")) {sendXmlAnswer(cl); setElectroCtrl(); responseElectroCtrl(cl);}
else if (StrContains(HTTP_req, "req_el_freq")) {sendXmlAnswer(cl); checkOscill(); responseElectroFreq(cl);}
else if (StrContains(HTTP_req, "request_sdcard")) {sendXmlAnswer(cl); responseSd(cl);}
else if (StrContains(HTTP_req, "request_network")) {sendXmlAnswer(cl); responseNetwork(cl);}
else if (StrContains(HTTP_req, "request_nrf24")) {sendXmlAnswer(cl); responseNrf24(cl);}
} // else if (StrContains(HTTP_req, GET))
} // parseRequest ( )
Re: визуализация данных
Добавлено: Чт янв 05, 2017 5:04 pm
serghei
Очередная затея с визуализацией - Механический Счетчик. Для начала картинка

- Counter.png (105.8 КБ) 7146 просмотров
Как видно в браузере ошибок нет , но в таком виде код не работает. Верхнее число это catch (err) {val = "530";} в файле jscount5.js . Подобная конструкция в .htm не работает. Нижнее число это пока просто декремент (уменьшение на 1) просто счетчика. Все файлы библиотек загрузились , css и фоновая картинка с АМС тоже как бы видна , но на экране её нет.
В очередной раз выражаю благодарность
Alexsis_76 за его терпение меня , науку программирования и вообще поднятую тему. Собственно знающих людей прошу помощи доделать код и привязать любое ( целое ) число из АМС.
Исходный сайт
http://jsgadget.ru/jscounter.html Сами файлы с обрезанными именами ( правило 8.3 и точку в названии файла не понимают)
Re: визуализация данных
Добавлено: Пт янв 06, 2017 1:05 pm
alexsis_76
но в таком виде код не работает
у тебя похоже не идет аякс,запросов не видно.
Re: визуализация данных
Добавлено: Пт янв 06, 2017 1:43 pm
serghei
Да. Вся эта конструкция не видит XML таблицу. Вот код страницы Full21.htm Там все работает. Сначала цепляем макрос. %& <!-- links -->. Потом внешний CSS с фоновой картинкой через <style>. Потом пишем скрипт внутри документа , который формирует страницу
Код: Выделить всё
<script>
function start() {
getFull21Data();
logoRotator();
getDashData();
}
Дальше по коду объявляем переменные и внутрь (!) документа вставляем библиотеку спидометра. А потом идет самое интересное - опять обращаемся к странице и формируем запрос
Код: Выделить всё
function getFull21Data() {
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {
if (this.responseXML != null) {
// net activ
insertTick(30, bufferCpuLoad2);
try {
data_val7 = this.responseXML.getElementsByTagName('tmpTemp')[0].childNodes[0].nodeValue;
} catch (err) {
data_val7 = "30";
}
Ну и заканчиваем request.open("GET", "request_dash" + randomNoCache(), true); .Потом опять макросом обращаемся к внешнему главному скрипту. И на последок выводим тело документа.
За 3 месяца вроде разобрался с этой кухней и все летает очень шустро. А вот с новой конструкцией страницы , где все библиотеки в отдельных файлах , не получается . Я подозреваю , что код запроса ответа надо вставить в jscount5.js файл. Но любые изменения его приводят к отсутствию цифр внутри счетчика.
PS Боюсь опять забанят из - за кода....
Re: визуализация данных
Добавлено: Пт янв 06, 2017 2:19 pm
alexsis_76
вот посмотри пытается загрузить DEMO.xml(замени на свой)у меня локально не грузится,поэтому для меня тут все заканчивается,ты должен увидеть содержимое xml
Re: визуализация данных
Добавлено: Пт янв 06, 2017 6:17 pm
serghei
Что то не взлетела ракета , наверное начинаются вечера на хуторе близ Диканьки )))). Внутри АМС есть двух файловая страница с полно экранным числом Full5.htm + отдельным файлом идет скрипт.И все летает очень шустро. То есть внутри hml файла есть ссылка на скрипт .js и все отлично работает.Код цепляет переменную объема воды с сенсора и на фоне картинки выводит число в полный экран
Там есть обращение к .js
Код: Выделить всё
<script>
function start() {
getFull5Data();
}
%# // scripts.js (mode one)
</script>
Надо разбираться дальше.