【问题标题】:Javascript json api callJavascript json api调用
【发布时间】:2017-06-27 03:27:08
【问题描述】:

我想通过向 JSON (https://maps.googleapis.com/maps/api/geocode/json?address=Pune) 传递一个城市名称(硬编码)并获取纬度和经度来对 JSON (https://maps.googleapis.com/maps/api/geocode/json?address=Pune) 进行 api 调用。我已经尝试了下面提到的代码。

function loadJSON(callback) {

  var xobj = new XMLHttpRequest();
  xobj.overrideMimeType("application/json");
  xobj.open("GET", "https://maps.googleapis.com/maps/api/geocode/json?address=Pune", true);
  xobj.onreadystatechange = function() {
    if (xobj.readyState == 4 && xobj.status == "200") {
      // Required use of an anonymous callback as .open will NOT return a value but simply returns undefined in asynchronous mode
      callback(xobj.responseText);
    };
    xobj.send();
  }

  function init() {
    loadJSON(function(response) {
      // Parse JSON string into object
      var myObj = JSON.parse(this.responseText);

      alert(myObj.results[0].geometry.bounds.northeast.lat);
      alert(myObj.results[0].geometry.bounds.northeast.lng);
      alert(myObj.results[0].geometry.bounds.southwest.lat);
      alert(myObj.results[0].geometry.bounds.southwest.lng);
      alert(myObj.results[0].geometry.location.lat);
      alert(myObj.results[0].geometry.location.lng);

      alert(myObj.results[0].geometry.viewport.northeast.lat);
      alert(myObj.results[0].geometry.viewport.northeast.lng);
      alert(myObj.results[0].geometry.viewport.southwest.lat);
      alert(myObj.results[0].geometry.viewport.southwest.lng);

    });
  }

【问题讨论】:

  • 您已共享了一些代码,但尚未描述您遇到的问题。有错误吗?你看到输出了吗?输出是否与您的预期不同?
  • 另外,您似乎缺少loadJSON 的右花括号。这是您尝试运行的实际代码吗?
  • 你的xobj.send()也放错地方了。
  • 嗨 smarx!是的,我面临一个错误。此外,预期的输出应该是查询字符串中发送的城市的纬度和经度。此外,我需要将这些纬度和经度传递给另一个 api 调用以获取格式化的地址。
  • 你能告诉我如何使用这个调用的输出来打印格式化的地址吗??

标签: javascript


【解决方案1】:

您的代码中存在一些问题:

  1. 您缺少 loadJSON 的右大括号。
  2. xobj.send() 放错地方了……它必须在 onreadystatechange 函数之外。
  3. 您在回调中使用了this.responseText,而不是您传入的参数。

我修复了这些问题,将alerts 转换为console.logs,并摆脱了不必要的overrideMimeType 呼叫。工作代码如下:

function loadJSON(callback) {

  var xobj = new XMLHttpRequest();
  xobj.open("GET", "https://maps.googleapis.com/maps/api/geocode/json?address=Pune", true);
  xobj.onreadystatechange = function() {
    if (xobj.readyState == 4 && xobj.status == "200") {
      callback(xobj.responseText);
    };
  }
  xobj.send();
}

function init() {
  loadJSON(function(responseText) {
      var myObj = JSON.parse(responseText);

      console.log(myObj.results[0].geometry.bounds.northeast.lat);
      console.log(myObj.results[0].geometry.bounds.northeast.lng);
      console.log(myObj.results[0].geometry.bounds.southwest.lat);
      console.log(myObj.results[0].geometry.bounds.southwest.lng);
      console.log(myObj.results[0].geometry.location.lat);
      console.log(myObj.results[0].geometry.location.lng);

      console.log(myObj.results[0].geometry.viewport.northeast.lat);
      console.log(myObj.results[0].geometry.viewport.northeast.lng);
      console.log(myObj.results[0].geometry.viewport.southwest.lat);
      console.log(myObj.results[0].geometry.viewport.southwest.lng);

    });
}

init();

【讨论】:

  • 感谢 smarx! :) 另外我需要知道是否有一种方法可以将纬度和经度值之一作为参数传递,然后使用它们从 JSON 中获取格式化的地址。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2011-06-06
  • 1970-01-01
  • 2021-03-09
  • 1970-01-01
  • 2015-04-27
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多