如何将 Json 数据绘制到数组中？答案

【问题标题】：How to plot Json data into Array?如何将 Json 数据绘制到数组中？
【发布时间】：2013-09-02 14:04:06
【问题描述】：

以下是我的 JSON 格式。

{
"Data": {
"-template": "Parallax",
"Explore": {
  "IslandLife": {
    "TourismLocation": [
      {
        "Title": "Langkawi",
        "Latitude": "6.350000",
        "Longitude": "99.800000",
        "YouTubePlaylistID": "UUnTJRksbHP4O8JSz00_XRQA",
        "VideosList": {
          "YouTubeVideoID": [
            "7HlMpaSspNs",
            "tzeRnbd77HU",
            "VkIAbDIVJCA",
            "ksJ6kwTe9wM"
          ]
        }
      },
      {
        "Title": "Rawa Island",
        "Latitude": "2.520278",
        "Longitude": "103.975833",
        "YouTubePlaylistID": "UUnTJRksbHP4O8JSz00_XRQA",
        "VideosList": { "YouTubeVideoID": "Kx0dUWaALKo" }
      },
      {
        "Title": "Perhentian Island",
        "Latitude": "5.903788",
        "Longitude": "102.753737",
        "YouTubePlaylistID": "UUnTJRksbHP4O8JSz00_XRQA",
        "VideosList": {
          "YouTubeVideoID": [
            "ZpcdGk5Ee0w",
            "TQTDOGpflZY"
          ]
        }
      },
      {
        "Title": "Sabah Marine Park",
        "Latitude": "4.623326",
        "Longitude": "118.719800",
        "YouTubePlaylistID": "UUnTJRksbHP4O8JSz00_XRQA",
        "VideosList": { "YouTubeVideoID": "VCDTEKOqpKg" }
      }
    ]
  }
}
  }
}

并在此函数下方使用我正在从 Json 检索数据

$.getJSON('json/explore.json', function(data) {
$.each(data, function(key, val) {
    for (var i = 0; i < val.Explore.IslandLife.TourismLocation.length; i++) {
       console.log(val.Explore.IslandLife.TourismLocation[i].Title);
        console.log(val.Explore.IslandLife.TourismLocation[i].Description);
         console.log(val.Explore.IslandLife.TourismLocation[i].Latitude);
         console.log(val.Explore.IslandLife.TourismLocation[i].Longitude);
        console.log(val.Explore.IslandLife.TourismLocation[i].YouTubePlaylistID);
    }
  });
 });

那么如何将“纬度”和“经度”绘制成双维数组？？

我想要这样的数组对象？？

var locations = [
['Langkawi', 6.350000, 99.800000, 4],
['Rawa Island', 2.520278, 103.975833, 3],
['Perhentian Island', 5.903788, 102.753737, 2],
['Sabah Marine Park', 4.623326, 118.719800, 1]
];

提前感谢:)

【问题讨论】：

标签： javascript jquery arrays json google-maps

【解决方案1】：

也许用这个

$.each($.parseJSON(data), function(i,item)
{

    // item.Explore etc etc

});

【讨论】：

【解决方案2】：

获取数据，然后遍历 TourismLocation 对象，将值添加到数组中，然后将该数组推送到包含数组：

$.getJSON('json/explore.json', function(data) {
    var locations = [];
    $.each(data.Data.Explore.IslandLife.TourismLocation, function(key, val) {
        var loc = [val.Title, val.Latitude, val.Longitude];
        locations.push(loc);
    });
    // use "locations" here, async and all
});

还要注意 ajax 是异步的，所以你不能在回调函数之外使用新创建的数组，因为它还不可用。

也不确定数组中的第四项是什么，但如果它只是一个反向迭代的数字，你也可以添加它：

$.getJSON('json/explore.json', function(data) {
    var locations = [],
        num = data.Data.Explore.IslandLife.TourismLocation.length;

    $.each(data.Data.Explore.IslandLife.TourismLocation, function(key, val) {
        var loc = [val.Title, val.Latitude, val.Longitude, num--];
        locations.push(loc);
    });
    // use "locations" here, async and all
});

【讨论】：

【解决方案3】：

var locations = [];

$.getJSON('json/explore.json', function(data) {
$.each(data, function(key, val) {
    for (var i = 0; i < val.Explore.IslandLife.TourismLocation.length; i++) {
       var currLoc = val.Explore.IslandLife.TourismLocation[i];
       locations.push([currLoc.Title, currLoc.Latitude, currLoc.Longitude];
    }
  });
});

console.log(locations);

但我无法想象你在哪里检索每个数组的4^th 元素：如果它是一个反向计数器，你可能会变成

...
$.each(data, function(key, val) {
    var t = val.Explore.IslandLife.TourismLocation,
        tLen = t.length;

    for (var i = 0; i < tLen; i++) {
       var currLoc = t[i];
       locations.push([currLoc.Title, currLoc.Latitude, currLoc.Longitude, (tLen - i)]);
    }
  });
});

【讨论】：