Raspberry Pi應用程序的信息網頁

Question

我有一個在rPi2上運行的應用程序。 讀取傳感器值並在文件上記錄時間標記（用Java編寫）。 我需要設置一個網頁來顯示這些日志。 由於Pi會變得無腦，所以我決定采用網頁方式。 我選擇了Charts.js作為圖表繪制庫。 它接受這樣的圖表數據：

var lineChartData = {
        labels : ["January","February","March","April","May","June","July"],
        datasets : [
            {
                label: "My First dataset",
                fillColor : "rgba(220,220,220,0.2)",
                strokeColor : "rgba(220,220,220,1)",
                pointColor : "rgba(220,220,220,1)",
                pointStrokeColor : "#fff",
                pointHighlightFill : "#fff",
                pointHighlightStroke : "rgba(220,220,220,1)",
                data : [1.1,2.2,3.3,4.4,5.5,6,7,8,9]
            }
        ]

    }

我需要以編程方式更改JSON上的數據和標簽值。 並將此頁面投放到本地網絡。 我試圖用這種JSON格式生成日志，但事實證明，如果用戶不從對話框中選擇文件，JS就無法加載本地文件。 那么對此有什么想法嗎？

Answer 1

這是一個很酷的項目。 我做了以下工作：

tmp_data.txt（測量后通過raspi上的java生成）：

{"labels" : ["January","February","March","April","May","June","July"],
    "datasets" : [
        {
            "label": "My First dataset",
            "fillColor" : "rgba(220,220,220,0.2)",
            "strokeColor" : "rgba(220,220,220,1)",
            "pointColor" : "rgba(220,220,220,1)",
            "pointStrokeColor" : "#fff",
            "pointHighlightFill" : "#fff",
            "pointHighlightStroke" : "rgba(220,220,220,1)",
            "data" : [1.1,2.2,3.3,4.4,5.5,6,5]
        }
    ]
}

tmp_data.html：

<html>
  <head>
    <script src="../Chart.js"></script>
    <script>
        function loadXMLDoc() {
            var xmlhttp=new XMLHttpRequest();
            xmlhttp.onreadystatechange=function() {
              if (xmlhttp.readyState==4 && xmlhttp.status==200) {
                var lineChartData = JSON.parse(xmlhttp.responseText);
                var ctx = document.getElementById("canvas").getContext("2d");
                new Chart(ctx).Line(lineChartData, {responsive: true});
              }
            }
            xmlhttp.open("GET","tmp_data.txt",true);
            xmlhttp.send();
        }
    </script>

</head>
    <body onload="loadXMLDoc()">
        <div style="width:30%">
            <div>
                <canvas id="canvas" height="450" width="600"></canvas>
            </div>
        </div>
    </body>
</html>

數據文件中的“字段”必須用引號引起來。 加載站點時將調用onload函數。 txt文件將通過httprequest讀取，並且必須與html頁面位於同一目錄中。 我建議raspi上的某些網絡服務器將提供html。
據我所知，如果沒有用戶交互，js無法在客戶端上加載本地文件，因為這可能是一個嚴重的安全問題。

Raspberry Pi應用程序的信息網頁

問題描述

1 個解決方案

解決方案1
0 已采納 2015-03-01 16:24:52

Raspberry Pi應用程序的信息網頁

問題描述

1 個解決方案

解決方案1 0 已采納 2015-03-01 16:24:52

解決方案1
0 已采納 2015-03-01 16:24:52