如何从外部按钮或链接获取当前位置单击GeoLocation Openlayers3

从外部按钮或链接获取当前位置单击GeoLocation Openlayers3的方法如下：

首先，需要在前端页面中添加一个按钮或链接，用于触发获取当前位置的操作。可以使用HTML的<button>或<a>标签来创建按钮或链接。
在JavaScript中，使用navigator.geolocation.getCurrentPosition()方法来获取当前位置的地理坐标。该方法会弹出一个对话框，询问用户是否允许获取位置信息。
在获取位置成功的回调函数中，可以使用Openlayers3库来显示地图，并将获取到的地理坐标显示在地图上。可以使用new ol.Map()创建地图对象，使用new ol.View()创建视图对象，并使用new ol.layer.Tile()创建图层对象。
在回调函数中，可以使用Openlayers3的ol.proj.fromLonLat()方法将获取到的经纬度转换为地图上的坐标。然后，可以使用new ol.Feature()创建要素对象，并使用new ol.geom.Point()创建点几何对象。
将创建的要素对象添加到地图的矢量图层中，可以使用new ol.layer.Vector()创建矢量图层对象，并使用getSource().addFeature()方法将要素对象添加到图层中。

以下是一个示例代码：

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="https://openlayers.org/en/v4.6.5/css/ol.css" type="text/css">
  <style>
    .map {
      height: 400px;
      width: 100%;
    }
  </style>
  <script src="https://openlayers.org/en/v4.6.5/build/ol.js"></script>
</head>
<body>
  <button onclick="getLocation()">获取当前位置</button>
  <div id="map" class="map"></div>

  <script>
    function getLocation() {
      if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition);
      } else {
        alert("浏览器不支持地理定位。");
      }
    }

    function showPosition(position) {
      var longitude = position.coords.longitude;
      var latitude = position.coords.latitude;

      var map = new ol.Map({
        target: 'map',
        layers: [
          new ol.layer.Tile({
            source: new ol.source.OSM()
          }),
          new ol.layer.Vector({
            source: new ol.source.Vector({
              features: [
                new ol.Feature({
                  geometry: new ol.geom.Point(ol.proj.fromLonLat([longitude, latitude]))
                })
              ]
            })
          })
        ],
        view: new ol.View({
          center: ol.proj.fromLonLat([longitude, latitude]),
          zoom: 10
        })
      });
    }
  </script>
</body>
</html>

这个示例代码中，点击按钮后会获取当前位置的地理坐标，并在地图上显示一个点标记，表示当前位置。使用的是Openlayers3库来显示地图和处理地理坐标。

页面内容是否对你有帮助？

有帮助

没帮助

如何从外部按钮或链接获取当前位置单击GeoLocation Openlayers3

、、

正在获取当前位置，但未显示标记图像(locationStyle) var locationCircle = new ol.Feature(); currentLocation = new ol.l

浏览 15提问于2016-08-09得票数 0

1回答

使用JavaScript执行ASP.NET回发(单击LinkButton) -回发会发生，但不会单击事件

、、、

以下是背景：当它有位置时(上面的调用是异步的--您必须等待用户同意共享他们的位置)，我希望脚本将位置回发到服务器我通过模拟隐藏链接按钮的回发来实现这一点。('ctr118

浏览 2提问于2012-12-01得票数 0

回答已采纳

1回答

如何将HTML5地理定位API坐标传递给我的Rails控制器？

、、

我正在尝试使用Open Weather API gem创建一个简单的add，其中用户可以单击按钮并显示其所在位置的当前天气。我想使用HTML5地理定位API返回用户的当前位置坐标，并使用这些坐标从Open Weather API获取数据。如何将latitude和longitude值从JS传递到控制器或服务类？我有以下代码： locations.js var x = document.getEleme

浏览 2提问于2019-06-02得票数 0

1回答

定位当前位置标记

、、、

我的代码是通过点击谷歌地图上的按钮为用户定位一个当前的位置标记，地理编码功能将收到地址信息。如何使地址采用当前位置值而不是输入值？

浏览 1提问于2017-05-01得票数 0

2回答

地理定位谷歌地图链接jQuery

、、

当我点击手机上的链接时，我想要一个提示，询问用户是否允许检测位置，如果是，则打开Google Maps，并显示从当前位置到最终目的地的方向。这就是我所拥有的，但当我单击该链接时，它会转到回退默认链接。 navigator.geolocation.ge

浏览 1提问于2012-05-04得票数 1

回答已采纳

1回答

ng-map -在navigator.geolocation.getCurrentPosition之后出现错误'setCenter: not a LatLng or LatLngLiteral: not

、、、

当使用ng-map时，我在点击一个自定义按钮后得到这个错误，我已经实现了这个按钮来获取用户的当前位置：我没有显式地执行'setCenter‘，并且只有在我使用以下命令检查用户的当前位置后才会出现错误： navigator.geolocation.getCurrentPosition我还有其他自

浏览 3提问于2017-10-11得票数 0

1回答

如何在已授予权限的情况下显示用户位置而不单击按钮

、、、、

实际上，我希望在用户授予权限的情况下，每次访问页面时都显示当前位置。Sidenote:就像Swiggy或Zomato一样，我们每次打开应用程序时都会显示位置。var x = document.getElementById("demo")

浏览 20提问于2019-07-12得票数 1

5回答

配置Intellij以运行批处理文件

、、

我正在使用InteliJ IDEA (社区添加)，我发现自己正在做一些文件传输到和从项目文件夹。在完成任务一段时间后，我创建了一些批处理脚本来自动传输文件。现在，如果我可以直接从IDE运行脚本，我会更高兴--例如，按一个按钮.谢谢!

浏览 11提问于2014-09-22得票数 41

回答已采纳

1回答

如何在新标签中自动打开链接，该选项卡包含在外部网站中，如quora.com？

、、、、

如何从外部网站(如Quora.com )获得链接，以及如何自动单击应该在新浏览器选项卡中打开的链接，以及如何使用JQuery或JavaScript、安卓或iOS进行链接。使用Jquery、Android、JavaScript或iOS自动<e

浏览 2提问于2017-05-12得票数 0

回答已采纳

1回答

当用户关闭Firefox和Chrome中的“物理位置”提示时，该如何处理？

、、、

Firefox：我的问题是:当用户不“允许”或“拒绝”位置选项，而是关闭提示时，如何处理？我有这个JAVASCRIPT代码，但是当用户关闭提示符时它不能工作： navigator.geolocation.getCurrentP

浏览 0提问于2012-02-09得票数 8

3回答

打开具有反应功能的外部链接

、、、

我试图创建一个按钮，在React打开一个外部链接到一个谷歌地图网址。我有一个函数，它要求用户提供地理位置，一旦提供，就把位置输入到url链接中，该链接从他们的地理位置获取方向到一个设置的目的地。但是，我很难让按钮首先运行该函数，并在新选项卡中打开URL。我现在就是这样调用按钮组件的。<Button variant="primary" onClick={t

浏览 0提问于2019-06-01得票数 7

1回答

如何创建当前位置的链接/url (google map v2，android)

、

我想创建一个应用程序，它以url的形式发送带有用户位置的文本信息，以便接收方可以使用浏览器或谷歌地图(如果安装在用户设备上)访问用户的位置。例如：接收者获取消息(其中包含url)。只需单击url，他将被重定向到浏览器或谷歌地图应用程序。接收方可以查看发送

浏览 2提问于2013-10-28得票数 2

1回答

遍历ejGrid中的复选框

、、

我试图弄清楚，当单击一个按钮时，如何遍历网格以查看选中了哪个复选框。

浏览 17提问于2021-12-17得票数 0

4回答

延迟表单提交，直到检索到位置

、、、

我有一个应用程序，它试图从浏览器获取位置设置，这往往需要一段时间，所以我希望它在页面加载时运行。但是，如果您在位置回调运行之前单击了submit按钮，则没有位置数据。我的问题很简单，在提交表单之前，我如何等待定位成功回调完成？(没有像睡眠语句这样愚蠢的东西)。

浏览 1提问于2012-05-02得票数 8

回答已采纳

2回答

事件以处理app已关闭(Ionic)

、、

我正在后台运行一个进程，在应用程序从最近的应用程序关闭之前，我需要关闭它(用正方形按钮向右滑动)。 $interval.cancel(promise); promise = $interval(geolocation_function= []){

浏览 4提问于2016-05-16得票数 5

回答已采纳

1回答

是否使用useEffect

、、

昨天，当一位同事要求对代码进行审查时，我们对如何解决这个问题有了不同的看法。在本例中，我们在单击按钮时更新sortOrder，作为获取数据的效果。如果我正确理解了这一点，那么当sortOrder状态发生变化时，我们会呈现一次，在获取数据之后也会呈现一次。我们应

浏览 5提问于2022-06-30得票数 0

1回答

如何在React Native Google Map上更改图标？

、

这段代码帮助我获取当前位置并绘制标记。async componentDidMount() { ....destination} image="marker.png";如何更改谷歌地图标记上的图标我尝试添加image:"maker

浏览 0提问于2019-03-16得票数 0

2回答

简单的Ajax Uploader插件停止工作

、、、、

不能再点击上传div/按钮了。这种情况发生在我们的网站上，甚至在上。这只发生在Chrome上，也只发生在Chrome今天关闭并重新启动的计算机上。

浏览 1提问于2019-09-05得票数 2

回答已采纳

2回答

地理定位API不起作用，谷歌地图也不是“我的位置”

、、

我一定是在做错事，但我找不到什么.我正在为我的公司网站制作一个页面，其中包括，根据用户的当前位置为求职网站提供指导。为了获得它们的位置，我使用了在火狐中实现的 (我在用FF9和FF10进行测试)。我用我的工作计算机在我的工作网络上，我的工作和家庭计算机在我的家庭互联网连接，我的工作计算机在一个无线热点从我的电话，它提供错误代码2每次。搜索“西雅图”(或其他地点，不管怎样)。在左边的“方向”框中，"A“应该写”

浏览 3提问于2012-02-02得票数 1

1回答