使用高德获取当前城市的天气信息

先看简单效果图：

1.创建账号：

需要在高德开放平台注册账号，并且创建对应的应用；

创建时 选择web服务即可。

创建成功后，你会得到对应的key；

2.天气信息相关文档链接

高德地图的官方解释文档天气查询-API文档-开发指南-Web服务 API | 高德地图API (amap.com)

功能及接口介绍的非常详细，但是 我没有使用（皮一下0.0，哈哈）；

1. • 自己使用的方法 （附代码）

   //获取当地城市及天气
     getLngLatLocation() {
      AMap.plugin("AMap.CitySearch", function () {
        var citySearch = new AMap.CitySearch();
        citySearch.getLocalCity(function (status, result) {
          if (status === "complete" && result.info === "OK") {
            // 查询成功，result即为当前所在城市信息
            // console.log("通过ip获取当前城市:", result);
            AMap.plugin("AMap.Weather", function () {
              //创建天气查询实例
              var weather = new AMap.Weather();
              //执行实时天气信息查询
              weather.getLive(result.city, function (err, data) {
                if (data) {
                  let weatherObj = {
                    weather: data.weather, //🌤
                    temperature: data.temperature, //温度 这里的温度应该是实时，我没有用
                    city: data.city, //城市
                    windDirection: data.windDirection, //风向"东北"
                    windPower: data.windPower //风力 "≤3"
                  };
                  localStorage.setItem(
                    "WEATHER_INFO",
                    JSON.stringify(weatherObj)
                  );
                }else{
                  console.log(err);
                }
              });

              //执行实时天气信息查询 主要为了获取当天的 最低温度 + 最高温度
              weather.getForecast(result.city, function (err, data) {
                if (data) {
                  const list = data.forecasts[0]
                  //温度
                  temperature = list.dayTemp + '~' + list.nightTemp;
                  localStorage.setItem(
                    "WEATHER_INFO",
                    JSON.stringify(temperature)
                  );
                }else{
                  console.log(err);
                }
              });
            });
          }
        });
      });
    },

另外使用时需要引入高德，我这边因为时vue项目，所以在index.html种进行了引入；

附代码如下：

<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=这里是你在开放平台申请的key&plugin=AMap.DistrictSearch,AMap.Geocoder,AMap.DistrictLayer,AMap.AutoComplete,AMap.PlaceSearch"></script>

这样的话就可以使用常用的一些天气信息了。

写的有点烂，只是作为日常记录。