我正在尝试使用此代码读取存储在同一目录中的JSON文件。我需要检索GPS信息并用它来绘制地图上的标记。但是，运行代码后没有任何内容出现。这是我的JSON文件。
[{
"SourceFile": "C:/Users/wolvix/Downloads/sample image/1024-2006_1011_093752.jpg",
"ExifToolVersion": 9.65,
"FileName": "1024-2006_1011_093752.jpg",
"Directory": "C:/Users/wolvix/Downloads/sample image",
"FileSize": "205 kB",
"FileModifyDate": "2014:06:29 18:42:21+08:00",
"FileAccessDate": "2014:06:29 18:42:20+08:00",
"FileCreateDate": "2014:06:29 18:42:21+08:00",
"FilePermissions": "rw-rw-rw-",
"FileType": "JPEG",
"MIMEType": "image/jpeg",
"JFIFVersion": 1.01,
"ExifByteOrder": "Little-endian (Intel, II)",
"ImageDescription": "KONICA MINOLTA DIGITAL CAMERA",
"Make": "Konica Minolta Camera, Inc.",
"Model": "DiMAGE A2",
"Orientation": "Horizontal (normal)",
"ModifyDate": "2006:10:11 09:37:52",
"ExifVersion": "0221",
"DateTimeOriginal": "2006:10:11 09:37:52",
"CreateDate": "2006:10:11 09:37:52",
"GPSVersionID": "0.0.2.2",
"GPSLatitudeRef": "South",
"GPSLongitudeRef": "East",
"GPSAltitudeRef": "Above Sea Level",
"Compression": "JPEG (old-style)",
"Keywords": "Australia",
"By-line": "John Harmon",
"Province-State": "New South Wales",
"Country-PrimaryLocationCode": "AUS",
"Country-PrimaryLocationName": "Australia",
"Caption-Abstract": "Sydney Harbor from the Manly-Sydney ferry",
"URL": "",
"ImageWidth": 1024,
"ImageHeight": 768,
"GPSAltitude": "0 m Above Sea Level",
"GPSLatitude": "33 deg 51' 21.91\" S",
"GPSLongitude": "151 deg 13' 11.73\" E",
"GPSPosition": "33 deg 51' 21.91\" S, 151 deg 13' 11.73\" E",
"ImageSize": "1024x768"
},
{
"SourceFile": "C:/Users/wolvix/Downloads/sample image/12382975864_09e6e069e7_o.jpg",
"ExifToolVersion": 9.65,
"FileName": "12382975864_09e6e069e7_o.jpg",
"Directory": "C:/Users/wolvix/Downloads/sample image",
"FileSize": "6.0 MB",
"FileModifyDate": "2014:07:17 18:37:24+08:00",
"FileAccessDate": "2014:07:17 18:37:19+08:00",
"FileCreateDate": "2014:07:17 18:37:19+08:00",
"FilePermissions": "rw-rw-rw-",
"FileType": "JPEG",
"MIMEType": "image/jpeg",
"ExifByteOrder": "Little-endian (Intel, II)",
"ImageDescription": "OLYMPUS DIGITAL CAMERA ",
"Make": "OLYMPUS IMAGING CORP.",
"Model": "STYLUS1",
"Orientation": "Horizontal (normal)",
"ModifyDate": "2014:01:23 14:57:18",
"ExifVersion": "0230",
"DateTimeOriginal": "2014:01:23 14:57:18",
"CreateDate": "2014:01:23 14:57:18",
"GPSVersionID": "2.3.0.0",
"GPSLatitudeRef": "North",
"GPSLongitudeRef": "West",
"GPSAltitudeRef": "Above Sea Level",
"GPSStatus": "Measurement Active",
"PrintIMVersion": "0300",
"Compression": "JPEG (old-style)",
"GPSAltitude": "0 m Above Sea Level",
"GPSLatitude": "50 deg 49' 8.59\" N",
"GPSLongitude": "0 deg 8' 12.45\" W",
"GPSPosition": "50 deg 49' 8.59\" N, 0 deg 8' 12.45\" W",
"ImageSize": "3968x2976"
},
{
"SourceFile": "C:/Users/wolvix/Downloads/sample image/gg_gps.jpg",
"ExifToolVersion": 9.65,
"FileName": "gg_gps.jpg",
"Directory": "C:/Users/wolvix/Downloads/sample image",
"FileSize": "79 kB",
"FileModifyDate": "2014:07:17 18:36:00+08:00",
"FileAccessDate": "2014:07:17 18:35:58+08:00",
"FileCreateDate": "2014:07:17 18:36:00+08:00",
"FilePermissions": "rw-rw-rw-",
"FileType": "JPEG",
"MIMEType": "image/jpeg",
"JFIFVersion": 1.02,
"ExifByteOrder": "Little-endian (Intel, II)",
"Make": "NIKON CORPORATION",
"Model": "NIKON D2H",
"Orientation": "Horizontal (normal)",
"ModifyDate": "2005:07:02 10:38:28",
"ExifVersion": "0220",
"DateTimeOriginal": "2003:11:23 18:07:37",
"CreateDate": "2003:11:23 18:07:37",
"GPSVersionID": "2.2.0.0",
"GPSLatitudeRef": "North",
"GPSLongitudeRef": "East",
"GPSTimeStamp": "18:07:37",
"GPSDateStamp": "2003:11:23",
"Compression": "JPEG (old-style)",
"GPSDateTime": "2003:11:23 18:07:37Z",
"GPSLatitude": "39 deg 54' 56.00\" N",
"GPSLongitude": "116 deg 23' 27.00\" E",
"GPSPosition": "39 deg 54' 56.00\" N, 116 deg 23' 27.00\" E",
"ImageSize": "500x375"
},
{
"SourceFile": "C:/Users/wolvix/Downloads/sample image/s_gps.jpg",
"ExifToolVersion": 9.65,
"FileName": "s_gps.jpg",
"Directory": "C:/Users/wolvix/Downloads/sample image",
"FileSize": "44 kB",
"FileModifyDate": "2014:07:17 18:36:45+08:00",
"FileAccessDate": "2014:07:17 18:36:44+08:00",
"FileCreateDate": "2014:07:17 18:36:45+08:00",
"FilePermissions": "rw-rw-rw-",
"FileType": "JPEG",
"MIMEType": "image/jpeg",
"JFIFVersion": 1.02,
"ExifByteOrder": "Little-endian (Intel, II)",
"ImageDescription": "Communications",
"Make": "FUJIFILM",
"Model": "FinePixS1Pro",
"Orientation": "Horizontal (normal)",
"ModifyDate": "2002:07:19 13:28:10",
"ExifVersion": "0200",
"DateTimeOriginal": "2002:07:13 15:58:28",
"CreateDate": "2002:07:13 15:58:28",
"GPSVersionID": "2.0.0.0",
"GPSLatitudeRef": "North",
"GPSLongitudeRef": "West",
"GPSTimeStamp": "14:58:24",
"GPSMapDatum": "WGS84",
"Compression": "JPEG (old-style)",
"Province-State": " ",
"Country-PrimaryLocationName": "Ubited Kingdom",
"Keywords": "Communications",
"CopyrightNotice": "ian Britton - FreeFoto.com",
"IPTCDigest": "f58a446d60cbb1883f4201ed4420ac36",
"DisplayedUnitsX": "inches",
"DisplayedUnitsY": "inches",
"GlobalAngle": 30,
"GlobalAltitude": 30,
"City": " ",
"State": " ",
"Country": "Ubited Kingdom",
"Category": "BUS",
"DateCreated": "2002:06:20",
"GPSLatitude": "54 deg 59' 22.80\" N",
"GPSLongitude": "1 deg 54' 51.00\" W",
"GPSPosition": "54 deg 59' 22.80\" N, 1 deg 54' 51.00\" W",
"ImageSize": "600x400",
}]
这是我的HTML，我在这里做错了什么？
<!DOCTYPE html>
<html>
<head>
<title>Test Map</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
</style>
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp" type="text/javascript"> </script>
<script language="javascript" type="text/javascript">
function initialize() {
var mapOptions = {
zoom: 15,
center: new google.maps.LatLng(1.3667, 103.8)
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
$.getJSON('out1.json', function(data) {
for (var i in data) {
var myLatlng = new google.maps.Latlng(data[i].GPSLatitude, data[i].GPSLongtitude);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: data[i].FileName
});
}
}
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
答案 0 :(得分：0)
如果你的Json数据是真的，你的代码获取数据:)。
//with for(var i in data) // i.GPSLatitude;
//with for(var i =0; i< data.length; i++) // data[i].GPSLatitude;
更改
<!DOCTYPE html>
<html>
<head>
<title>Test Map</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
</style>
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp" type="text/javascript"> </script>
<script language="javascript" type="text/javascript">
var map;
var markers = new array();
function initialize() {
var mapOptions = {
zoom: 15,
center: new google.maps.LatLng(1.3667, 103.8)
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
$.getJSON('out.json', function(data) {
for (var i =0; i< data.length; i++) {
//with for(var i in data) // i.GPSLatitude;
//with for(var i =0; i< data.length; i++) // data[i].GPSLatitude;
var myLatlng = new google.maps.Latlng(data[i].GPSLatitude, data[i].GPSLongtitude);
markers[i] = new google.maps.Marker({
position: myLatlng,
map: map,
title: data[i].FileName
});
}
}
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>