OL3:按坐标从图层获取特征

2024-01-22

我想通过坐标获取图层的特征。 此外,我想在弹出窗口中打开此功能,到目前为止我已经通过 onclick 事件解决了这个问题。但我想通过给出特征的坐标并打开特征的弹出窗口来实现。

我有一个带有地图的图层和一个带有以下功能的图层:

if (trackMap != null) {
  for (var i = 0; i < trackMap.length; i++) {
    var trackInfo = trackMap[i];
    lat = parseFloat(trackInfo.lat);
    lon = parseFloat(trackInfo.lon);

    var layergpx = new ol.layer.Vector({
      source: new ol.source.Vector({
        parser: new ol.parser.GPX(),
        url: '${contextRoot}/gps/gpx2' + trackInfo.url
      })
    });
    layers.push(layergpx);
  }
}

我想在另一个Javascript函数中获取这一层的功能。

如何通过单击地图打开弹出窗口:

/**
 * The Click Event to show the data
 */
var element = document.getElementById('popup');
var popup = new ol.Overlay({
      element: element,
      positioning: ol.OverlayPositioning.BOTTOM_CENTER,
      stopEvent: false
});
map.addOverlay(popup);

map.on('singleclick', function(evt) {
  map.getFeatures({
    pixel: evt.getPixel(),
    layers: vectorLayers,
    success: function(layerFeatures) {
      var feature = layerFeatures[0][0];
      if (feature) {
        var geometry = feature.getGeometry();
        var coord = geometry.getCoordinates();
        popup.setPosition(coord);
        $(element).popover({
          'placement': 'top',
          'html': true,
          'content': feature.get('desc')
        });
        $(element).popover('show');
      } else {
        $(element).popover('destroy');
      }
    }
  });
});

但我希望不要通过在地图上单击来打开此功能,而是通过在文本字段中输入坐标来打开此功能,然后地图会打开此弹出窗口,就像在 onclick 事件中一样。


看一下这个例子,看看它是否对您有帮助:http://openlayers.org/en/latest/examples/kml.html http://openlayers.org/en/latest/examples/kml.html

var displayFeatureInfo = function(pixel) {
  map.getFeatures({
    pixel: pixel,
    layers: [vector],
    success: function(featuresByLayer) {
      var features = featuresByLayer[0];
      var info = [];
      for (var i = 0, ii = features.length; i < ii; ++i) {
        info.push(features[i].get('name'));
      }
      document.getElementById('info').innerHTML = info.join(', ') || '&nbsp';
    }
  });

map.getFeatures() 有这个成功回调,它提供在layers: [vector]中指定的图层的特征。随意定制以获得您所需要的。

===更新===

在 OpenLayers 3 的 Map 对象中,您有一个函数: getPixelFromCooperative

/**
 * @param {ol.Coordinate} coordinate Coordinate.
 * @return {ol.Pixel} Pixel.
 */
ol.Map.prototype.getPixelFromCoordinate = function(coordinate) {
  var frameState = this.frameState_;
  if (goog.isNull(frameState)) {
    return null;
  } else {
    var vec2 = coordinate.slice(0, 2);
    return ol.vec.Mat4.multVec2(frameState.coordinateToPixelMatrix, vec2, vec2);
  }
};
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

OL3:按坐标从图层获取特征 的相关文章

  • jQuery mobile 中的文本区域高度和宽度?

    我修复了 jQuery mobile 中文本区域元素的高度 并且在纵向中得到了完美的高度和宽度 但在横向中宽度没有放大 谁能帮我 提前致谢 HTML
  • Jquery 悬停卡

    我在用着http designwithpc com Plugins Hovercard http designwithpc com Plugins Hovercard 但我不知道如何在悬停卡上声明 var 每个工作描述都有自己的 ID 当悬
  • JavaScript 添加布尔值

    console log true true 2 console log typeof true true number console log isNaN true true false 为什么两个布尔类型相加会产生一个数字 我有点理解 如
  • 显示具有多个父代的 D3 树

    我目前有this http bl ocks org mbostock 4339083图已实现 我希望在描述具有多个父节点的子节点时保持结构和可折叠性 有没有办法做到这一点 我研究了力图 但我也想保留一组层次结构 这意味着 1 级的父级可以有
  • 在特定页面上执行 javascript 的正确“Rails”方式

    我试图在特定页面上运行 javascript 而我唯一的解决方案似乎是反模式 我有controller js内部生成的assets javascripts 我在用着gem jquery turbolinks 我的代码类似于以下内容 docu
  • 位置特征检测:固定

    我正在尝试找到一个脚本来检测设备是否放置position fixed元素相对于视口而不是整个文档 目前 标准桌面浏览器和 Mobile Safari 适用于 iOS 5 都是这样做的 而 Android 设备则相对于整个文档放置固定元素 我
  • 如何在没有 jQuery 的情况下删除 Javascript 中的元素

    我试图通过以下方式从 DOM 中删除 Div a 标签嵌套在其中 我想我正在寻找的是 jQuery 的纯 Javascript 版本 div remove 这是html设置 div a href Click me to remove the
  • 如何正确清理来自 AngularJS 控制器的无效输入的表单?

    我有一个 AngularJS 表单 其中包含 除其他字段之外 类型之一url 后者很重要 因为这会强制相应的输入成为有效的 URL 在某些条件下 例如 要关闭具有此类表单的模式对话框 我想以编程方式清除该表单 为此 我实现了方法reset基
  • Number.IsNaN() 比 isNaN() 更糟糕吗

    Soooooo isNaNJavaScript 显然被破坏了 比如 isNaN isNaN isNaN true isNaN false isNaN 0 返回 false 当它们看起来都是 不是数字 在 ECMAScript 6 中 草案包
  • JavaScript 验证和 PHP 验证?

    我正在使用 jquery 验证插件来验证空表单 我还应该在 PHP 中检查一下以确保 100 正确吗 或者用 javascript 验证就可以了 谢谢 您应该始终在服务器上进行验证 如果用户以某种方式不使用 Javascript 提交表单
  • 按下回车键时不刷新页面

    我遇到了一些问题 只要表单中有输入 回车键就会触发页面刷新 下面的代码 如果按下回车并且文本区域 input 中没有输入任何文本 则不会刷新页面 但是如果按下回车并且 input中有输入或者光标位于文本区域 我不确定是什么触发了它 因为 s
  • 如何使用 Greasemonkey 监视静态 HTML 页面的更改?使用哈希?

    我希望我的 Greasemonkey 脚本仅在其访问的静态页面具有与以前完全相同的内容时运行 现在我可以设置一个包含该页面哈希的变量 我正在寻找一种动态散列页面的方法 以便我可以将我的散列与生成的散列进行比较 关于如何即时实现散列的任何想法
  • JavaScript 继承;调用和原型

    要在Javascript中实现继承 通常需要执行以下两个步骤 假设我有一个基类 Animal var Animal function name this name name 我现在想从中派生一个子类 Dog 所以我想说 var Dog fu
  • JavaScript RegEx:不同的结果:使用字符串和使用正则表达式“文字”构建模式?

    使用 RegExp 文字与字符串之间有什么区别吗 http jsfiddle net yMMrk http jsfiddle net yMMrk String prototype lastIndexOf function pattern p
  • 如何计算特定字符在字符串中出现的次数

    我正在尝试创建一个函数来查看数组中的任何字符是否在字符串中 如果是 有多少个 我尝试计算每一种模式 但是太多了 我尝试使用 Python 中的 in 运算符的替代方案 但效果不佳 function calc fit element var
  • 改变 JavaScript 中的顶部填充

    以下是我在 css 中设置顶部填充的方法 body font size font size px margin 0 padding 100px 0 20px 0 width 100 important 如何使用最简单的 javascript
  • Google Maps API (v3) 添加/更新标记

    编辑 它现在可以工作 但如果用户不允许或没有基于位置的服务 则不会加载 请参阅 jsfiddle 示例接受的答案评论 我已经浏览了一些教程和问题 但我无法安静地理解正在发生的事情 或者在这种情况下 没有发生 当用户单击链接时 我正在加载地图
  • Rails 3.1+ 的 Jasmine 与 Mocha JavaScript 测试 [已关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 我对茉莉花有经验并且非常喜欢它 有谁有 Jasmine 和 Mocha 的经验 特别是 Rails 的经验吗 我想知道是否值得转用 我已经在 J
  • 主页(网格)上的缩略图现在显得模糊。如何纠正?

    我不知道这看起来是否愚蠢 但从早上开始我就无法纠正这个突然出现在我的博客网站上的错误www candidopinions in http www candidopinions in 我有一个网格视图模板 其中博客文章中的特色图像作为调整大小
  • 有没有办法使用 ko.observableArray 作为地图?

    有没有办法使用ko observableArray http knockoutjs com documentation observableArrays html像地图 字典一样 例如 var arr ko observableArray

随机推荐

  • 自动续订订阅:一个月有多长?

    我对一些问题感到困惑 1 自动续费订阅的一个月期限是30天还是按照自然月 因为我只能在沙盒模式下测试 所以持续时间只有几分钟 也许苹果只是简单地这样计算 2013 01 15 gt 2013 02 15 gt 2013 03 15 如果是这
  • r 在 for 循环中创建并寻址变量

    我在一个文件夹中有多个 csv 文件 我想将此文件夹中的每个 csv 文件加载到一个单独的数据框中 接下来 我想从该数据框中提取某些元素到一个矩阵中 并计算所有这些矩阵的平均值 setwd D data group 1 lt list fi
  • CMDeviceMotion 用户加速度漂移

    我正在使用以下方法获取加速度数据 CMDeviceMotion userAcceleration 我注意到一件有趣的事情 Z 轴上总是有一个小偏差 约为 0 0155 方差为 0 002 而在其他轴上 平均值接近 0 我正在使用 iPod
  • 查看 IsEnabled 属性在 Xamarin Forms 上不起作用

    这是我的列表视图 Listview 内部按钮 IsEnabled 属性不起作用 IsEnabled False 不起作用 我遵循了此步骤 但仍然不起作用https forums xamarin com discussion 47857 se
  • 寻找一个Linux PDF库来从PDF中提取注释和图像[关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我正在寻找一个免费的库 Java Ruby 它可以在linux上运行 并且可以从PDF中提取图像和注释
  • 从文件流上传到 ADLS

    我正在 ADF 中进行自定义活动 其中涉及从 Azure 存储 Blob 读取多个文件 对它们进行一些处理 最后将生成的文件写入 Azure Data Lake Store 最后一步是我停止的地方 因为据我所知 NET SDK 只允许从本地
  • .NET 应用程序中的最大线程数?

    在 C 应用程序中可以创建的最大线程数是多少 当达到这个限制时会发生什么 是否抛出某种异常 没有固有的限制 最大线程数由可用物理资源量确定 看到这个文章作者 雷蒙德 陈 https devblogs microsoft com oldnew
  • 使用 JavaMail 创建带有附件的 EML 文件 [关闭]

    这个问题不太可能对任何未来的访客有帮助 它只与一个较小的地理区域 一个特定的时间点或一个非常狭窄的情况相关 通常不适用于全世界的互联网受众 为了帮助使这个问题更广泛地适用 访问帮助中心 help reopen questions 我将使用
  • 如何在发布模式下启用框架的可测试性?

    我有一个 iOS 应用程序项目 由 Swift 3 0 编写 该工作区包含我们团队构建的动态框架 用于在整个项目中共享可重用的代码和资源 We use Activate Compilation Conditions用于切换生产服务器 url
  • PhpMyAdmin |致命错误:第 0 行未知中允许的内存大小 134217728 字节已耗尽(尝试分配 xxxxxx 字节)

    我试图找到此错误的原因 但失败了 我已经在我的服务器上安装了 PhpMyAdmin 现在在每个页面的页脚上都收到此错误 致命错误 第 0 行未知中允许的内存大小 134217728 字节已耗尽 尝试分配 10934248 字节 正如您所看到
  • “命令”对象没有属性“has_permissions”

    client command commands has permissions administrator True async def kick ctx member discord Member reason None try awai
  • IdentityServer、声明和角色

    我正在使用 Identity Server v4 但我认为与 v3 相同 和 NET Core 现在我有一个我不明白的奇怪问题 在我的 MVC 应用程序中 我使用 授权 角色 极客 保护我的控制器 操作 从以下位置查看当前用户HttpCon
  • 在android中为按钮添加阴影

    我试图在单击时在图像按钮上添加某种阴影 是否可能以及如何实现 所以我有按钮 我希望当我点击它时它看起来像是被按下的 所以我创建了新的 xml 如下所示
  • 如何在 Next JS 博客中实现上一篇文章和下一篇文章?

    我想从特定的博客文章转到上一篇文章和下一篇文章 考虑一下这个盖茨比的例子 https gatsby starter blog demo netlify com my second post https gatsby starter blog
  • 如何停止 Android webView swipeToRefresh 加载进度条?

    注意 这个问题已经被问过here https stackoverflow com questions 41467855 how to stop swipetorefresh progressbar in webview没有得到任何答案 所以
  • 在迭代 Java ArrayList 时修改它

    我想做类似的事情this https stackoverflow com questions 993025 java adding elements to a collection during iteration 但是 我不希望迭代添加的
  • ListJoinedTeams 可以指定 /me 工作,但不能指定 /user

    I tried ListJoinedTeams与指定用户 但它不起作用 我试过ListJoinedTeams与我自己和Listmessage与指定用户一起使用并且它有效 不起作用 https graph microsoft com v1 0
  • 如何在媒体查询中使用 > 或 <(大于和小于)符号

    我们可以在媒体查询中使用 gt 或 media screen and min width lt 768px 媒体查询不使用这些符号 相反 他们使用min and max 前缀 这包含在spec http www w3 org TR css3
  • bootstrap 无法连接到 Angular 6?

    npm install bootstrap 配置angular json styles node modules bootstrap dist css bootstrap min css styles scss 直接导入src style
  • OL3:按坐标从图层获取特征

    我想通过坐标获取图层的特征 此外 我想在弹出窗口中打开此功能 到目前为止我已经通过 onclick 事件解决了这个问题 但我想通过给出特征的坐标并打开特征的弹出窗口来实现 我有一个带有地图的图层和一个带有以下功能的图层 if trackMa