Error while reading from local JSON file in JavaScript
Question
I am new to JavaScript. My JavaScript (script.js) reads from a JSON file as shown below. The script reads without using JQuery. I followed THIS site for reference.
function readJSON() {
var LatLongData = JSON.parse(data);
var LatLng1 = new google.maps.LatLng(LatLongData[0]);
}
The JSON file (data.json), stored in the same location as the JavaScript is as below:
{ "data":
[
{"latitude" : "40.10246648", "longitude" : "-83.14877599"}
]
}
The html file is as shown below:
<script type="text/javascript" src="data.json"></script>
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=MyKey&sensor=true"></script>
<body onload="readJSON()">
<div id="map-canvas"/>
</body>
I get 2 errors (both in chrome as well as Firebug) on the JSON file format. However, I verified online ( http://jsonlint.com/ ) that the JSON file is of the right format. The errors I get are:
SyntaxError: missing ; before statement { "data":
ReferenceError: data is not defined ---> var LatLongData = JSON.parse(data);
What am I doing wrong here?
2 answers
solution1
3 ACCPTED 2013-10-29 21:01:55
You can't read the json like that. First of all you should not include it via <script> tag. You need to get the json via ajax request. I'll suggest to check the jQuery's getJSON method:
$.getJSON( "data.json", function( data ) {
// now you can read the data
var LatLongData = data;
var LatLng1 = new google.maps.LatLng(LatLongData[0]);
});
What you are doing is to include the json as javascript file. That's why you got that error. Second, your readJSON uses data variable which is actually never defined.
solution2
1 2013-10-29 21:06:14
You included this Json
{ "data":
[
{"latitude" : "40.10246648", "longitude" : "-83.14877599"}
]
}
but the code is expecting a variable called data, if you pay attention to the example in the link in their "json" file they are "cheating" , it's not pure JSON as is declaring a global variable, containing a string. That string is the json. So if you go ahead following those practice you should have a "json" file.
with
var data = '[ {"latitude" : "40.10246648", "longitude" : "-83.14877599"}]'
but I suggest you to follow Krasimir's answer.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.