Сцены и оформление (сборка)

[SmoKE_xDDD]

Пока откатился, но чувствую придется подыскивать что-то другое. MаjorDomo, - классная штука, но простому пользователю с ней трудно справиться.

Попробуйте ХаС :DDDD Там же все очень просто (нет).

[homester]

И все-же, подскажите пожалуйста, почему после крайнего обновления на Мастер, и давно уже на Альфе, перестал работать onclick вот в этих конструкциях:

Код: Выделить всё

<span class='butSay %ThisComputer.minMsgLevel|"1=;S"%'onclick='ajaxSetGlobal("ThisComputer.minMsgLevel",1);'>Мах</span>

<div class='buttK2 %Relay04.status|"B;A;A;"%' onclick="callMethod('Relay04.switch');"><img class="animK" src="/cms/scenes/kul-50.png" /><p class="txtB">Вентилятор</p></div>

<div class='buttK1 %Relay06.auto|"B;A;A;"%' onclick="commandС1('%Relay06.auto%','Relay06.auto');"><p class="txtC">%Relay06.auto|"Руч;Авто;Цикл;"%</p></div>

Js

Код: Выделить всё

function commandС1(id1,id2){
  if (Number(id1)==0) {id1=2} else {id1=0}
  ajaxSetGlobal(id2,id1)
}

[immortal]

добавил в шапку, вроде всё просмотрел.

[immortal]

добавил в шапку:
virtuino mqtt dashboard

скриныSPOILER_SHOW

видео, описание, файлыSPOILER_SHOW

видео, описание, файлы

[yoshok]

может кому пригодится

Код: Выделить всё

<script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/4.2.1/echarts.min.js"></script>




    <div id="main" style="width:1000px;height:500px;"></div>
    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('main'));
        option = {
            tooltip: {
                formatter: "{a} <br/>{c} {b}"
            },
            toolbox: {
                show: true,
                feature: {
                    restore: { show: true },
                    saveAsImage: { show: true }
                }
            },
            series: [
												
                {
                    name: '',
                    type: 'gauge',
                    center: ['66%', '50%'],
                    z: 3,
                    min: %Sensor_temp01.minValue%,  // минимальная температура
                    max: %Sensor_temp01.maxValue%,  // максимальная температура 
                    splitNumber: 10,
                    radius: '50%',
                    axisLine: {           
                        lineStyle: {       
                            color: [[0.20, 'lime'],[0.79, '#1e90ff'],[1, '#ff4500']],
                    width: 3,
                    shadowColor : '#fff', //Прозрачный по умолчанию
                    shadowBlur: 10
                        }
                    },
                    axisTick: {           
                        length: 15,       
                        lineStyle: {      
                            color: 'auto'
                        }
                    },
                    splitLine: {          
                        length: 20,         
                        lineStyle: {       
                            color: 'auto'
                        }
                    },
                    pointer: {
                        width: 4
                    },
                    title: {
                        textStyle: {      
                            fontWeight: 'normal',
                            fontSize: 16,
                            color: '#1e90ff',
                            // fontStyle: 'italic'
                        }
                    },
                    detail: {
                        textStyle: {       
                            fontWeight: 'normal'
                            
                           
                             
                        }
                    },
                    data: [{ value: %Sensor_temp01.value%,  name: 'Температура' }]  // температура
                },	
            ]
        };
        setInterval(function () {
        
            option.series[3].data[0].value = (Math.random() * 2).toFixed(2) - 0;
            myChart.setOption(option, true);
        }, 2000);
        myChart.setOption(option);
    </script>

[xor]

может кому пригодится

Код: Выделить всё

<script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/4.2.1/echarts.min.js"></script>

Супер! у себя использую steelseries, там плюс в том, что можно на комп скопировать код и не зависеть от инета. интересно, тут так можно?

[andrey040670]

Супер! у себя использую steelseries, там плюс в том, что можно на комп скопировать код и не зависеть от инета. интересно, тут так можно?

А почему бы и нет?
Закинуть локально echarts.min.js и указать путь до него.

echarts.min.js

(729.89 КБ) 227 скачиваний

[yoshok]

может кому пригодится

Код: Выделить всё

<script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/4.2.1/echarts.min.js"></script>

Супер! у себя использую steelseries, там плюс в том, что можно на комп скопировать код и не зависеть от инета. интересно, тут так можно?

вроде как можно, если прописать путь

Код: Выделить всё

<script type="text/javascript" src="echarts.min.js"></script>

[yoshok]

нашел еще электронную диаграмму, я ее использую для погоды на несколько дней, через рамблер погода.

Код: Выделить всё

 <body style="height: 100%;">
    <div id="mysomiline" style=" width: 700px;height: 250px;"></div>
    <script type="text/javascript" src="/js/echarts.common.min.js"></script>
   <script type="text/javascript">
        var dom = document.getElementById("mysomiline");
        var myChart = echarts.init(dom);
        var app = {};
        option = null;
        
        var namedate = ['%v_moskve.0_date%','%v_moskve.1_date%', '%v_moskve.2_date%', '%v_moskve.3_date%', '%v_moskve.4_date%', '%v_moskve.5_date%', '%v_moskve.6_date%'];
        var numdate = [%v_moskve.0_day_temperature%, %v_moskve.1_day_temperature%, %v_moskve.2_day_temperature%, %v_moskve.3_day_temperature%, 
   %v_moskve.4_day_temperature%, %v_moskve.5_day_temperature%, %v_moskve.6_day_temperature%,];
        var colorlist = [];
        numdate.forEach(element => {
            if (element < 30) {
                colorlist.push(["#ffffff", "#00FFFF"])
        } else if (element >= 0 && element < 20) {
            colorlist.push(["#386ffd", "#74b3ff"])
        } else {
			colorlist.push(["#1aa8ce", "#49d3c6"])
        }
        });
        option = {

            tooltip: {
                trigger: 'axis',
                  axisPointer: {            // 
                    type: 'shadow'        // ：'line' | 'shadow'
                }
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis: [
                {
                    type: 'category',
                    data: namedate,
                    axisTick: {
                        alignWithLabel: true
                    },
                    axisLine: {
                        lineStyle: {
                            color: "#4dd1c4",
                            width: 1
                        }
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#999'
                        }
                    }
                }
            ],
            yAxis: [
                {
                    type: 'value',
                    axisLabel: {
                        formatter: '{value} °',
                        show: true,
                        textStyle: {
                            color: '#fff'
                        }
                    },
                    axisLine: {
                        lineStyle: {
                            color: "#4dd1c4",
                            width: 1
                        }
                    },
                    splitLine: {
                        show: true,
                        lineStyle: {
                            type: 'dashed',
                            color: '#ddd'
                        }
                    }

                }
            ],
            series: [
                {
                    name: 'Температура',
                    type: 'bar',
                    barWidth: '80%',
                    data: numdate,
                    itemStyle: {
                        normal: {
                            // color: new echarts.graphic.LinearGradient(
                            //     0, 0, 0, 1,
                            //     [
                            //         {offset: 1, color: 'red'},
                            //         {offset: 0, color: 'orange'}
                            //     ]
                            // )
                            color: function (params) {
                                // var colorList = colorlist;
                                // return colorList[params.dataIndex];
                                var colorList = colorlist

                                var index = params.dataIndex;
                                // if(params.dataIndex >= colorList.length){
                                //         index=params.dataIndex-colorList.length;
                                // }
                                return new echarts.graphic.LinearGradient(0, 0, 0, 1,
                                    [
                                        { offset: 1, color: colorList[index][0] },
                                        { offset: 0, color: colorList[index][1] }
                                    ]);


                            }
                        }
                    }
                }
            ]
        };
        ;
        if (option && typeof option === "object") {
            myChart.setOption(option, true);
        }
    </script>    

[Ultimo]

Подскажите есть ли какая прога конструктор, виджетов, кнопок ,информеров ну что то типо того?