Данные графика, полученные из базы данных Firebase (в реальном времени) - PullRequest
Новая
       34

Данные графика, полученные из базы данных Firebase (в реальном времени)

0 голосов
/ 19 октября 2019

У меня проблема с отображением числового массива в Plotly . Таким образом, мы можем перейти к теме без дальнейших церемоний.

Вот HTML-код: 

<script src="plotly.min.js"></script>
<!-- <link rel="stylesheet" type="text/css" href="styles.css"> -->
</head>
<body>

    <script src="https://www.gstatic.com/firebasejs/7.2.0/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/7.2.0/firebase-analytics.js"></script>
    <script src="https://www.gstatic.com/firebasejs/7.2.1/firebase-auth.js"></script>
    <script src="https://www.gstatic.com/firebasejs/7.2.1/firebase-database.js"></script>

    <div class="navbar"><span>Analog Plotter by remidosol</span></div>
    <div class="wrapper">
    <div id="chart"></div>


    <script src="FireConfig.js"></script>    
    <script>

        Plotly.plot('chart',[{
            y:[analogval()],
            type:'line'
        }]);

        var cnt = 0;
        setInterval(function(){
            Plotly.extendTraces('chart',{ y:[[analogval()]]}, [0]);
            cnt++;
            if(cnt > 300) {
                Plotly.relayout('chart',{
                    xaxis: {
                        range: [cnt-300,cnt]
                    }
                });
            }
        },15);
    </script>
    </div>
</body>

Как я могу построить число ARRAY, чточитать с Firebase ? Я однажды изменил код возврата функции getData (как будто я поместил параметр массива num в getData, но это не заставило код plot.ly работать для построения данных). Я мог читать данные из Firebase, но не мог отобразить их.

Вот вид моего веб-сайта и консоли: Он читает данные, но не может печатать.

Не могли бы вы помочь мне, пожалуйста? Что не так с этим кодом? КСТАТИ, блок конфигурации Firebase в порядке, я изменил его перед созданием этой темы. Я жду вашей помощи. Спасибо с этого момента.



Редактировать: Я могу получить данные и преобразовать их в число с помощью методов замены и среза. Теперь это правильно. Но код plot.ly все еще не отображает строку данных.

Следуя вышеупомянутой функции, вот код ниже: 

function analogval(){ 
    databaseiot.orderByChild("analog").on('value', function(dataSnapshot) { 
        var arru = dataSnapshot.val().analog;
        arru.toString();
        arru = arru.replace(/\\r/g,'');
        arru = arru.slice(1, 4);
        arru = Number(arru);
        console.log(arru);
        return arru;
        //arru = data.val().analog.split(",").map(Number); 
})}
...