在 OpenLayers 3.20+ 中使用 view.fit() 使用 view.animate()

2024-01-14

我有以下为 OpenLayers 3.20 之前版本编写的代码:

fitViewToFeature: function (viewer, feature) {
    var pan = ol.animation.pan({
      source: viewer.olView.getCenter(),
      duration: 1000
    })

    var zoom = ol.animation.zoom({
      resolution: viewer.olView.getResolution(),
      duration: 1000
    })

    viewer.olMap.beforeRender(pan, zoom)

    viewer.olView.fit(feature.getGeometry(), viewer.olMap.getSize(), {
      padding: [ 100, 100, 100, 100 ],
      constrainResolution: false,
      maxZoom: 4
    })
}

我的问题是如何将此函数转换为 OpenLayers 3.20 中引入的新 view.animate() 语法?

或者,我应该打开 GitHub 问题并请求将新选项添加​​到 view.animate 中吗?


您应该能够以更简单的方式实现相同的动画,使用duration的选项ol.View#fit():

viewer.olView.fit(feature.getGeometry(), {
  duration: 1000
});

以上适用于 OpenLayers 4.x。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 OpenLayers 3.20+ 中使用 view.fit() 使用 view.animate() 的相关文章

  • openlayers3开发教程_开始

    openlayers3开发教程 开始 openlayers官方网站 https openlayers org 在旧版本处查看 Latest v3 v3 20 1 released 2016 12 12 docs API examples o
  • openlayers3_API简说

    openlayers3 API简说 API文档 https openlayers org en v3 20 1 apidoc API 变更政策 OpenLayers 3 x API 包括 类 类方法和属性的名称 静态函数和常量的名称 函数参
  • 如何在 OpenLayers-3 中使用 SVG 图像作为地图标记?

    我正在尝试使用 SVG 图像在 OpenLayers 3 OL3 中创建地图 针滴 即地图标记 目前 我使用 PNG 图像作为引用 ol style Icon 源 src 属性的 pindrop 效果很好 但是 使用 SVG 图像时会失败
  • Geoserver - 使用 DWITHIN 过滤点

    首先 我是 Geoserver 和 Openlayers 的新手 我一直试图在 Geoserver 端使用图层预览页面来使用 Openlayer 查看器查看我的图层 我最终会将其实现为 Openlayers WFS GET 请求 我想要完成
  • 开放层 3:如何为修改交互创建侦听器

    我已经成功设置了修改交互 ol interaction Modify 的文档 http ol3js org en master apidoc ol interaction Modify html 不要提及修改功能时触发的单个事件 与 ol
  • 矢量图块缓冲区

    我在使用 Geoserver 提供的矢量切片设置 Openlayers 地图时遇到问题 线条沿着瓷砖的边缘拧在一起 看起来线条是先被剪裁 然后再设计样式 而不是相反 这使得宽线看起来很难看 更改 LOL 客户端中的渲染缓冲区不会产生任何影响
  • 在隐藏元素中绘制 OpenLayers 3 地图

    我正在编写一个页面 您可以在其中查看有关区域和地图的详细信息 详细信息位于一个选项卡上 地图位于另一个选项卡上 HTML 的相关部分如下 类来自引导程序 http getbootstrap com css div class col xs
  • 如何在 OpenLayers 3 中使描边不透明度起作用

    无论我如何尝试 我都无法在 OpenLayers 3 中使描边不透明度正常工作 我试图实现的是用 0 5 的不透明度在 OSM 平铺地图上画一条线 这是示例代码 var lineString new ol geom LineString 4
  • OpenLayers 3 和 XYZ 层

    I have a map which I want to display It consists of a standard map OSM Google or Bing and a layer provided by Openseamap
  • OpenLayers 动画 getView().fit()

    我一直在研究 openlayers 的动画功能 我可以看到使用缩放到给定点和分辨率是多么简单 view animate center position zoom 11 但我不知道如何制作动画 map getView fit extent m
  • OpenLayers 3 图像和文本样式 zindex

    我注意到文本和图像样式在渲染时似乎不遵守其图层顺序 例如 当具有这些样式的许多要素靠近时 所有文本都会呈现在其他重叠矢量要素之上 有没有办法禁用或覆盖这种行为 谢谢 myFeature setStyle new ol style Style
  • 打开第3层,map.on('moveend',..):区分用户交互和map.setCenter()调用

    我正在为 GIS 应用程序实现 OL 并希望在用户滚动地图时添加 20 秒的超时 之后 GPS 自动跟踪功能应恢复 为此 我正在利用 map on moveend move func 侦听器 问题是它无法区分用户滚动还是位置更改来自map
  • 使用 OpenLayers 从 GeoServer Javascript 编辑 WFS

    看完后非常好有关如何使用 OpenLayers 编辑 WFS 的教程 http wordpress dbauszus rhcloud com wfs t with openlayers 3 5 我尝试过复制它 但是使用来自 Geoserve
  • div 下面仍然触发 click 事件

    这是我正在构建的 PhoneGap 应用程序 我正在我的笔记本电脑上进行测试 然后使用 PhoneGap cli 在 iPhone 上进行测试 我有一个 openlayers 3 地图 上面记录了点击事件 我还有一个 div 当菜单显示时
  • 性能测试 OpenLayers 与 Leaflet

    我想比较 OpenLayers 和 Leaflet 之间的性能 我想测试诸如渲染矢量文件 底图 显示大量标记等最快的东西 我可以自己设置这个例子 但我不知道如何实际测量它们之间的速度差异 在哪里可以看到执行将矢量数据加载到地图等任务实际需要
  • 使用 OpenLayer3 显示标记、弹出窗口

    我试图了解如何使用 openlayers3 在 osm 地图上显示标记 弹出窗口 我在 ol3 网页上的示例中找到了示例 但是 是否有更多使用 javascript 或 jquery 编码标记 弹出窗口的示例 最好是类似的this http
  • 从 Openlayers 3 视口获取所有功能

    我试图找出 Openlayers 3 中图层上可见的所有功能 视口 如果我向地图添加点击事件 我可以找到一个功能 如下所示 但我无法找到视口中可见的所有功能 有人可以帮忙解决这个问题吗 map on click function evt v
  • Openlayers 3:以编程方式选择功能

    我正在尝试将我的系统从 Openlayers 2 升级到 Openlayers 3 但我遇到了一个我似乎无法解决的特定问题 我的应用程序有一个网格和一张地图 当用户单击网格时 我想选择地图上的相关点 在 Openlayers 2 中我使用了
  • 找不到模块:错误:无法使用 TypeScript 定义文件解析“openlayers”

    在使用 TypeScript 的 Visual Studio 2017 React 应用程序中 有一个使用 OpenLayers v4 6 5 的组件 Map tsx package json 文件加载 types openlayers 和
  • Openlayers3:中止绘制交互

    我在 html 中使用绘制交互来手动绘制路线 manual route creation event createRoute click function remove previous interactions map removeInt

随机推荐

  • lldb 可以与 fortran 一起使用吗?

    我正在尝试对 Fortran 程序设置断点lldb在 Mac OS 10 12 5 系统上 我有 program badcall integer a b a 2 b 3 write a b end I have to 使用英特尔编译器进行编
  • 在批处理文件中显示 .txt 的内容?

    我现在正在处理一个批处理文件 我已经完成了我需要的一切 但我陷入了困境 我使用的程序之一会输出一个日志文件 我让它将该文件放在 C 驱动器上的一个文件夹中 我想做的是让它读取这个 txt 并将其作为回显返回到批处理文件中 您可以将其放入批处
  • 如何设置 jQuery UI 对话框默认值

    如何设置 jQuery UI 对话框的默认值 例如 这就是我在 jQuery UI 日期选择器中设置默认值的方式 datepicker setDefaults dateFormat dd mm yy 我在中找不到相同的功能对话 文档 htt
  • 如何在 Emacs 初始化文件中生成键盘宏?

    我经常定义一个特定的键盘宏 因此我认为如果每次加载 Emacs 时它都自动可用 可能会很方便 我怎样才能做到这一点 怎么样保存键盘宏 http www gnu org software emacs manual html node emac
  • Android模拟器和virtualbox不能同时运行

    每当我运行 Virtualbox 时 我都无法启动 Android 模拟器映像 反之亦然 AVD管理器中的错误消息是 ioctl KVM CREATE VM failed Device or resource busy ko failed
  • PowerShell - 匹配运算符和多个组

    我正在 PowerShell 中处理以下日志条目 我正在尝试使用以下命令提取所有活动名称和持续时间 match操作员 但我只拿回一组比赛 当我使用 C 做同样的事情时 我没有得到我看到的所有匹配项Regex目的 有人可以解释我做错了什么吗
  • 在 lucene 索引中存储和检索 Json 对象

    我已经将一组 json 对象存储到 lucene 索引中 并且还想从索引中检索它 我使用的是lucene 3 4 那么有没有任何库或简单的机制可以在 lucene 中实现这一点 例如 Json 对象 BOOKNAME1 id 1 name
  • Python Pandas 警告:尝试在 DataFrame 切片的副本上设置值

    我有一个 Pandas DataFrame 我想用以下代码更改列的所有值 df Population round df Population 1000000 1 我收到以下警告 A value is trying to be set on
  • ruby 中的字节与代码点

    ruby 字符串函数之间有什么区别 代码点和字节 abcd bytes gt 97 98 99 100 abcd codepoints gt 97 98 99 100 bytes无论字符大小如何 都返回单个字节 而codepoints返回
  • Powershell 版本 5 Copy-Item -FromSession 找不到

    我正在尝试通过以下方式从远程会话复制一些日志文件 FromSession的参数Copy Itemcmdlet 在呼叫计算机上我安装了 PS 版本 5 运行脚本时我收到以下错误 Copy Item A parameter cannot be
  • Lodash 地图并返回唯一值

    我有一个 lodash 变量 var usernames map data usernames 产生以下结果 joebloggs joebloggs simongarfunkel chrispine billgates billgates
  • URIencode 和冒号

    冒号是一个可以根据许多站点编码为 3A 的字符 当我尝试使用编码时URIencode它不工作 例如 如果我尝试编码URIencode 然后什么也没有发生 返回冒号 为什么是这样 有人可以帮我吗 提前致谢 The encodeURI 对特殊字
  • 如何运行 Alamofire 库

    I downloaded the alamofire library and opened the iOS Example xcodeproj but it won t run In import Alamofire when i comm
  • 到 Task.Run 或不到 Task.Run

    假设我有一个包含异步方法的接口 并且该接口有两个不同的实现 这两种实现之一自然是异步的 而另一个则不是 实现非异步方法的 最正确 方法是什么 public interface ISomething Task
  • 无法在 xcode 崩溃报告中找到发生崩溃的代码

    我在 x code 中收到了几个崩溃报告 由用户报告 但无法找出它的用途 我在项目中打开它 但它没有显示发生崩溃的代码行 显然我尝试单击堆栈跟踪的每一行 如果您想在已发布的版本中触发崩溃 那么您应该将崩溃报告程序集成到您的项目中 并且Cra
  • 如何检查两个异步任务是否成功完成

    在函数中实现此流程图的最佳和最简单的方法是什么 现在我正在使用两个调度组 但我需要检查它们是否都已完成 而不仅仅是它们何时完成 如果他们完成了 那么 Friends 数组将包含元素 昵称数组将包含元素 注 FB是Facebook FIR是F
  • Python-读取具有不同分隔符的数据文本文件

    我有一个文件 其中字段由 分隔 子字段由 分隔 子字段中的项目由 分隔 我想读Python 一段时间后 我可能可以逐行阅读它 然后分割所有内容 但我相信这种事情已经存在了 文件的一行 0 16 250 1 0 053 RIG DIS 1 4
  • Prism - EventAggregator.GetEvent<>.Subscribe() - 使用泛型和约束

    我在使用作为棱镜框架一部分的事件聚合器订阅事件时遇到问题 如果我使用诸如 eventAggregator GetEvent
  • 无法从控制台将 .csv 导入 Cloud SQL

    我尝试了多种方法将 csv 文件导入 Cloud SQL PostgreSQL 但没有成功 psql f import sql 不起作用 它说我必须是超级用户才能导入 但 copy 有效 所以我尝试了 copy 但失败了 我得到 postg
  • 在 OpenLayers 3.20+ 中使用 view.fit() 使用 view.animate()

    我有以下为 OpenLayers 3 20 之前版本编写的代码 fitViewToFeature function viewer feature var pan ol animation pan source viewer olView g