在WIN7及更高版本中没有绘制Dygraph数据?

时间:2016-01-05 22:02:55

标签: html dygraphs

利用dygraph javascript的硬件是嵌入式PIC24FJ64GB004,配置为数据记录器和大容量存储设备,拇指驱动器。从USB上拔下它将9轴惯性数据:加速度,角速度和磁力计记录到根驱动器上作为.csv文件。当插入USB端口时,批处理文件使用dygraph javascript将数据解析为可用于.html显示的位置的文本文件。

系统在WINXP SP3中正常运行但未能在未来版本的Windows中显示数据。

利用F12开发人员工具我得知文本文件在WINXP中没有很好地形成,但在Windows 10中 - F12声明如下:

dygraph-combined.js:2 XMLHttpRequest cannot load file:///C:/Users/Cal/Desktop/ER9D0F/Temp/Graph/data/accelerate.txt. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.Dygraph.start_ @ dygraph-combined.js:2
dygraph-combined.js:2 XMLHttpRequest cannot load file:///C:/Users/Cal/Desktop/ER9D0F/Temp/Graph/data/gyrate.txt. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.Dygraph.start_ @ dygraph-combined.js:2
dygraph-combined.js:2 XMLHttpRequest cannot load file:///C:/Users/Cal/Desktop/ER9D0F/Temp/Graph/data/magnetic.txt. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.Dygraph.start_ @ dygraph-combined.js:2
dygraph-combined.js:2 XMLHttpRequest cannot load file:///C:/Users/Cal/Desktop/ER9D0F/Temp/Graph/data/temp.txt. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.Dygraph.start_ @ dygraph-combined.js:2

的Util

问题:为什么两个操作系统之间存在差异? .net版本是个问题吗?是否有更详细的数据格式描述?

谢谢 Cy Drollinger

HTML BELOW和此

下面的数据文件的一部分

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9">
    <title>dygraph</title>
    <!--[if IE]>
    <script type="text/javascript" src="../excanvas.js"></script>
    <![endif]-->
    <!--
    For production (minified) code, use:
    <script type="text/javascript" src="dygraph-combined.js"></script>
    -->
    <script type="text/javascript" src="dygraph-combined.js"></script>
	
	<style type="text/css">
      #div_g1 { position: absolute; left: 210px; top: 50px; }
      #div_g2 { position: absolute; left: 720px; top: 50px; }
      #div_g3 { position: absolute; left: 210px; top: 450px; }
      #div_g4 { position: absolute; left: 720px; top: 450px; }
    </style>
	
  </head>
  <body>
    <p>Acceleration, Angular Velocity, and Magnetic Field viewable upon a double click!</p>
    <div id="div_g1"></div>
	<div id="div_g2"></div>
	<div id="div_g3"></div>
	<div id="div_g4"></div>
    
	<script type="text/javascript">
      g1 = new Dygraph(document.getElementById("div_g1"),
                      "data/accelerate.txt",{fillGraph: true, avoidMinZero: true,title: 'X Y Z Acceleration', xlabel: 'Time (sec)',  ylabel: 'Acceleration(g)'}); 
      g2 = new Dygraph(document.getElementById("div_g2"),
                      "data/gyrate.txt",{fillGraph: true, avoidMinZero: true,title: 'X Y Z AngularVelocity', xlabel: 'Time (sec)',  ylabel: 'AngularVelocity(deg/sec)'});
	  g3 = new Dygraph(document.getElementById("div_g3"),
                      "data/magnetic.txt",{fillGraph: true,avoidMinZero: true,title: 'X Y Z Heading', xlabel: 'Time (sec)',  ylabel: 'Heading (uT)'});
	  g4 = new Dygraph(document.getElementById("div_g4"),
                      "data/temp.txt",{fillGraph: true,avoidMinZero: true,title: 'Temperature', xlabel: 'Time (sec)',  ylabel: 'Temperature (C)'});
      
    </script>
    
  </body>
</html>

数据文件(部分)

Time(sec.),X Acceleration(g), Y Acceleration(g), Z Acceleration(g)
 0.00, -0.71408, 0.05718, 0.59433
 0.01, -0.72532, 0.08358, 0.58553
 0.02, -0.72776, 0.09677, 0.59433
 0.03, -0.76051, 0.11339, 0.57087
 0.04, -0.76051, 0.12366, 0.56696
 0.05, -0.78739, 0.12317, 0.58113
 0.06, -0.77713, 0.09775, 0.62268
 0.07, -0.78250, 0.12512, 0.65591
 0.08, -0.77713, 0.10802, 0.62072
 0.09, -0.80401, 0.06891, 0.53568
 0.10, -0.76246, 0.11241, 0.53324

1 个答案:

答案 0 :(得分:0)

我已将数据解析为data.js,例如示例中使用的data.js文件:temperature-sf-ny.html。与示例一样,函数加速被调用。 data.js看起来像这样:

function accelerate() {
 return "" +
"Time,X,Y,Z\n" +
"0.00,0.10508,0.51271,1.29130\n" +
"0.01,0.09091,0.47410,1.20039\n" +
"0.02,0.06158,0.42815,1.04545\n" +
"0.03,0.03715,0.38856,0.88465\n" +
"0.04,0.01711,0.33920,0.73705\n" +
"0.05,-0.07234,0.33920,0.65445\n" +
"0.06,-0.12366,0.34702,0.66373\n" +
"0.07,-0.14809,0.40860,0.74487\n" +
"0.08,-0.18377,0.43842,0.83627\n" +
"0.09,-0.18328,0.41740,0.86706\n" +
"0.10,-0.15152,0.39638,0.92180\n" +
"0.11,-0.08944,0.38905,1.00440\n" +

虽然这没有回答这个问题,但它确实让我得到了我需要的地方。索引页面上的快速链接中有更详细的数据组件描述:数据格式。