谷歌地理定位 API答案

【问题标题】：Google Geolocation API谷歌地理定位 API
【发布时间】：2017-12-02 01:50:19
【问题描述】：

我正在学习使用 Google Geolocation API。我有我的钥匙，我只是想制作一个简单的表格，它采用城市名称并使用 Geolocation API 返回纬度和经度。

简单的形式是：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

</head>
<body>

<form>
    <fieldset>
        <ul>

            <li>
                <label for="city-search">City Name</label>
                <input type="text" id="city-search" placeholder="e.g. Rochester, NY">
            </li>

        </ul>

    </fieldset>

    <input type="button" id="sub" value="Submit" onclick="geolocation()">


</form>

<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script>
<script src="geolocation.js"></script>

</body>
</html>

谁能告诉我如何使用 Geolocation API 以检索输入城市的纬度和经度。

【问题讨论】：

标签： javascript jquery google-maps google-geolocation

【解决方案1】：

没有 API 密钥的每日限制是 2500。你可以阅读我的问题 - Where to place API key for Google Geocoding API?

如果您只是在客户端浏览器上使用地理编码，则不需要 Google API Key。 如果您的客户是重度用户并且您想代表您的客户付款，您仍然可以传递密钥。

这是工作演示 - https://jsfiddle.net/uj5qcqx0/

$(function() {
  $('#sub').click(function() {
    var city = $('#city-search').val();
    if (city.length) {
      var url = "https://maps.googleapis.com/maps/api/geocode/json?sensor=false&address=" + city;
      $.get(url, function(data) {      	
        $("#result").text(JSON.stringify(data));        
      });
    } else {
      alert("Please enter city.");
    }
  });
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label for="city-search">City Name</label>
<input type="text" id="city-search" placeholder="e.g. Rochester, NY">

<input type="button" id="sub" value="Submit">

<div id="result"></div>

【讨论】：

所以到目前为止，我们需要为任何请求包含一个 API，您对此有任何更新的解决方案吗？
另外，我相信地理定位和地理编码现在是用于不同目的的独立功能。（地理定位：定位用户，地理编码：根据地址给出坐标，反之亦然）