I am trying to use Google Charts to display some data from a csv file.
I've looked on stack overflow and found this, and I tried following this tutorial (here) but I can't seem to get past the first step, accessing the csv file.
I download the jquery.cvs-0.71.js
and placed it together with my cvs and html-file in the same folder. I use the cvs file from the tutorial.
This is my code for the HTML file:
<!DOCTYPE html>
<html>
<head>
<title>Google Chart Example</title>
<script src="https://www.google.com/jsapi"></script>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="jquery.csv-0.71.js"></script>
<script>
// wait till the DOM is loaded
$(function() {
// grab the CSV
$.get("kzn1993.csv", function(csvString) {
// display the contents of the CSV
$("#chart").html(csvString);
});
});
</script>
</head>
<body>
<div id="chart"></div>
</body>
</html>
I really have no idea why it's not working. I try to open the .html
file, but the page remains blank. The title is set though.
Any help? Thanks!
Error log in javascript console:
Failed to load resource: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
XMLHttpRequest cannot load file:///../../kzn1993.csv. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.