I'm completely new to this sort of programming, and am trying to use dygraphs on a Raspberry Pi. I cannot figure out how to load my data.csv file, which resides in the same directory as dygraphs.js and the HTML file.
Probably more correctly stated: I cannot figure out how to specify the path and file name so the CSV data will load. A graph does show up when I run the HTML below, but with no data. Everything works fine if I include the data within the actual HTML file, but that's of no use; I need to be able to load and graph various data.csv files stored locally.
Here's the HTML code, which is copied from the dygraphs Tutorial page (except for changing the "temperatures.csv" to "data.csv") -
<html>
<head>
<script type="text/javascript"
src="dygraph.js"></script>
<link rel="stylesheet" src="dygraph.css" />
</head>
<body>
<div id="graphdiv2"
style="width:500px; height:300px;"></div>
<script type="text/javascript">
g2 = new Dygraph(
document.getElementById("graphdiv2"),
"data.csv", // path to CSV file
{} // options
);
</script>
</body>
</html>
UPDATE: I've now tried running dygraphs on my Windows 7 machine (Firefox 104.0.2 browser), with exactly the same results: with dygraphs.js, dygraphs.css, the Tutorial HTML code above (with the CSV file name changed back to "temperatures.csv") and temperatures.csv all in the same directory, I get an empty graph without labels or proper axes scaling. However, when I run the first Tutorial example, where the data is included in the HTML file, it produces a correct graph.
MORE INFORMATION: I see in the browser that I'm getting the following error message -
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at file:///C:/Users/sjhebrock/Desktop/temperatures.csv. (Reason: CORS request not http).
Can anyone sort this for me?