以纬度和经度为变量的地理位置

Posted 2023-02-23

【中文标题】以纬度和经度为变量的地理位置

【英文标题】：Geolocation with Latitude and Longitude as variables

【发布时间】：2020-09-26 03:59:13

【问题描述】：

如果可以的话，感谢您抽出时间提供帮助！

我正在构建一个天气应用程序，并且我正在处理一个页面，该页面需要经常通过用户手机更新纬度和经度。

我意识到有两种方法可以做到这一点......

getCurrentPosition() watchPosition()

我不确定如何将纬度/经度输入到请求中

这是我正在使用的代码

<link rel="stylesheet" href="https://cdn.aerisapi.com/wxblox/latest/aeris-wxblox.css">
<script src="https://cdn.aerisapi.com/wxblox/latest/aeris-wxblox.js"></script>

<!--// target DOM element where WeatherBlox will be rendered //-->
<div id="wxblox" class="aeris-wrapper"></div>

<script> 

// set Aeris account access keys
const aeris = new AerisWeather('CLIENT_ID', 'CLIENT_SECRET');
aeris.on('ready', () => 

    // create desired WeatherBlox instance
    var view = new aeris.wxblox.layouts.local.Main('#wxblox', 
        obs: 
            advisories: 
                enabled: true
            ,
            threats: 
                enabled: true
            
        ,
        nearby: 
            request: 
                limit: 4
            
        ,
        shortterm: 
            request: 
                limit: 3
            
        ,
        forecast: 
            type: "detailed"
        ,
        maps: 
            animation: 
                enabled: true,
                autoplay: false,
                alwaysShowPast: false,
                alwaysShowFuture: false,
                from: -2,
                to: 0,
                duration: 2,
                endDelay: 1,
                intervals: 10
            ,
            controls: 
                layers: [
                    
                        value: "radar",
                        title: "Radar"
                    ,
                        value: "satellite",
                        title: "Satellite"
                    ,
                        value: "alerts",
                        title: "Advisories"
                    ,
                        value: "temperatures,clip-us-flat",
                        title: "Temps"
                    
                ],
                regions: [
                    
                        zoom: 7,
                        title: "Local"
                    ,
                        zoom: 5,
                        title: "Regional"
                    
                ]
            
        
    );

    // load data and render the view for a specific location
    view.load(
        p: "Latitude, Longitude"
    );
    
);

</script>

在底部显示 p:"Latitude, Longitude" 是我需要将这些地理定位方法的结果作为变量放置的位置。也许更清楚应该是“用户纬度，用户经度”

用户打开应用程序，这是他们将看到的第一页。这是一个本地天气状况页面，它从离用户最近的天气观测点获取数据。

如果我必须在这两种方法之间进行选择，我可能更喜欢 watchPosition，因为它会在用户移动时跟上用户的位置。

感谢您提供的任何帮助

此致，

贾斯汀

【问题讨论】：

如果你把他们的位置放在这里，当他们移动时它不会更新。

需要在watchPosition的回调函数中更新天气位置。

那么使用 getCurrentPosition 并在应用程序中启用自动刷新会更好吗？

我对@9​​87654323@ 应用程序一无所知。如果它可以自己获取位置，则您根本不需要做任何事情。

好吧，我正在制作一个应用程序。这只是一种访问他们的数据并将其显示在 html 页面中的方法。我正在尝试通过手机 gps 获取位置数据......并让其中一种地理定位方法在底部的 p：“纬度，经度”部分中提供纬度和经度

【参考方案1】：

在getCurrentPosition()的成功回调中调用view.load()。

// load data and render the view for a specific location
Geolocation.getCurrentPosition(pos => 
    console.log(`Showing weather for lat $pos.coords.latitude, long $pos.coords.longitude`);
    view.load(p: `$pos.coords.latitude, $pos.coords.longitude`);
, err => console.log(`Geolocation error: $err.message`));

完整代码：

// set Aeris account access keys
const aeris = new AerisWeather('CLIENT_ID', 'CLIENT_SECRET');
aeris.on('ready', () => 

  // create desired WeatherBlox instance
  var view = new aeris.wxblox.layouts.local.Main('#wxblox', 
    obs: 
      advisories: 
        enabled: true
      ,
      threats: 
        enabled: true
      
    ,
    nearby: 
      request: 
        limit: 4
      
    ,
    shortterm: 
      request: 
        limit: 3
      
    ,
    forecast: 
      type: "detailed"
    ,
    maps: 
      animation: 
        enabled: true,
        autoplay: false,
        alwaysShowPast: false,
        alwaysShowFuture: false,
        from: -2,
        to: 0,
        duration: 2,
        endDelay: 1,
        intervals: 10
      ,
      controls: 
        layers: [
          value: "radar",
          title: "Radar"
        , 
          value: "satellite",
          title: "Satellite"
        , 
          value: "alerts",
          title: "Advisories"
        , 
          value: "temperatures,clip-us-flat",
          title: "Temps"
        ],
        regions: [
          zoom: 7,
          title: "Local"
        , 
          zoom: 5,
          title: "Regional"
        ]
      
    
  );

  console.log("Getting Geolocation");
  // load data and render the view for a specific location
  Geolocation.getCurrentPosition(pos => 
    console.log(`Showing weather for lat $pos.coords.latitude, long $pos.coords.longitude`);
    view.load(
      p: `$pos.coords.latitude, $pos.coords.longitude`
    );
  , err => console.log(`Geolocation error: $err.message`));

);