百度地图 缩放 0.5 zoomend zoom_changed

设置/获取地图级别官网地址 : https://lbsyun.baidu.com/jsdemo.htm#bSetGetMapZoom

解决方案

 //创建一个地图
let map = new BMapGL.Map("container");
//这里还需定位下位置,这里就不详细说明了,官方文档有示例
//开启鼠标滚轮缩放功能。仅对PC上有效
map.enableScrollWheelZoom(true);
//滚动开始触发事件,可通过map.getZoom() 获取缩放比例
map.addEventListener("zoomstart", function (e) {console.log(e.target.zoomLevel.toFixed(2));
});
//滚动动画及 步进入 触发事件 此事件在 zoomend 后 还会触发 ,不建议在此处进行任何操作,该位置仅做测试
map.addEventListener("zoom_changed", function (e) {console.log(e.target.zoomLevel.toFixed(2));
});
//滚动结束触发事件,如不想频繁触发,可通过节流函数控制
map.addEventListener("zoomend", function (e) {console.log(e.target.zoomLevel.toFixed(2));
});
//滚动动画开始时触发,在zoomstart事件后执行  
map.addEventListener("animation_start", function (e) {//加try 的原因 该方法不是zoom 唯一所有try {//zoom 包含三个参数 current 当前缩放比例 ,target 目标缩放比例  diff 比例差值let _zoom = this._animationInfo.zoom;//绝对值验证 放大 还是 缩小 //0.75 是为了防止 缩放控件 +1 -1 或其他缩放方法影响 if (!(Math.abs(_zoom.diff) > 0.75)) {// o.5 步进值if (_zoom.diff > 0) {this._animationInfo.zoom.diff = 0.5;} else {this._animationInfo.zoom.diff = -0.5;}this._animationInfo.zoom.current = _zoom.current;//改变目标值this._animationInfo.zoom.target = _zoom.current + this._animationInfo.zoom.diff;}} catch (error) {}
});

源码分析

//动画触发事件
_startInfiniteZoomAnimation: function(t) {var e = this;e._ani && e._ani.stop(!!t.goToEnd, {stopCurrentAnimation: t.stopCurrentAnimation}),e._infiniteAni || (this.fire(new aB("onanimation_start")),e._infiniteAni = new l({duration: 1e4,transition: bq.linear,render: function() {//步进值var i = e._animationInfo.zoom;return Math.abs(i.current - i.target) < .001 ? (e._setValue("zoom", i.target),void e._infiniteAni.stop()) : (i.current += .35 * (i.target - i.current),e._setValue("zoom", i.current),void (t.renderCallback && t.renderCallback()))},finish: function() {e._infiniteAni = null,e._animationInfo = {},e.fire(new aB("onanimation_end")),t.callback && t.callback()},onStop: function() {e._infiniteAni = null,e._animationInfo = {},e.fire(new aB("onanimation_end")),t.callback && t.callback()}}))
}
// zoom_changed 触发事件
_setValue: function (e, T) {if (e === "zoom") {this._preZoomLevel = this.zoomLevel;var i = this._getProperZoom(T);T = i.zoom;if (T !== this.zoomLevel) {this.zoomLevel = T;if (T < 5) {this.restrictCenter(this.centerPoint)}this.fire(new fS("on" + e + "_changed"))}return} else {if (e === "center") {this.centerPoint = T}}this["_" + e] = T;this.fire(new fS("on" + e + "_changed"))
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/73779.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

在VScode中使用sftp传输本地文件到服务器端

安装SFTP 在VScode的扩展中安装sftp 注意这里需要在你没连接服务器的状态下安装&#xff0c;即本机需要有sftp 配置传输端口 安装成功后&#xff0c;使用快捷键"ctrlshiftp",输入sftp&#xff0c;选择Config 根据自己的实际情况修改配置文件&#xff0c;主要改h…

Golang-GJSON 快速而简单的方法来从 json 文档获取值

GJSON 是一个 Go 包&#xff0c;它提供了一种快速而简单的方法来从 json 文档获取值。它具有单行搜索、点符号路径、迭代和解析 json 行等功能。 GJSON 也可用于Python和Rust 入门 安装中 要开始使用GJSON 请安装 Go 并运行 go get &#xff1a; $ go get -u github.com/ti…

大型企业是否有必要进行数字化转型?

数字化转型对大型企业来说是至关重要的。随着科技的不断发展和市场竞争的加剧&#xff0c;企业面临着更高的客户期望、更复杂的供应链管理、更快的市场变化等挑战。以下是为什么大型企业有必要进行数字化转型的几个主要理由&#xff1a; 提升效率和生产力&#xff1a; 数字化…

AQS同步队列和等待队列的同步机制

理解AQS必须要理解同步队列和等待队列之间的同步机制&#xff0c;简单来说流程是&#xff1a; 获取锁失败的线程进入同步队列&#xff0c;成功的占用锁&#xff0c;占锁线程调用await方法进入条件等待队列&#xff0c;其他占锁线程调用signal方法&#xff0c;条件等待队列线程进…

Python学习 -- datetime模块

当涉及到处理日期和时间数据时&#xff0c;Python的datetime模块提供了一系列类来帮助您执行各种操作。以下是各个类及其常用方法的详细介绍&#xff1a; date 类 date 类表示一个年、月、日的日期对象。以下是一些常用的 date 类方法&#xff1a; date.today()获取当前日期…

css自学框架之图片灯箱展示

实现的功能是页面中的图片单击&#xff0c;在灯箱中显示&#xff0c;单击按钮上下切换&#xff0c;单击灯箱退出展示&#xff0c;效果如下GIF展示。 实现步骤还是老样子&#xff0c;三方面工作一是CSS、二是JavaSxcript&#xff0c;三是HTML&#xff0c;下面开始一步一步实现&…

nginx使用详解

文章目录 一、前言二、nginx使用详解2.1、nginx特点2.2 静态文件处理2.3 反向代理2.4 负载均衡2.5 高级用法2.5.1 正则表达式匹配2.5.2 重定向 三、总结 一、前言 本文将详细介绍nginx的各个功能使用&#xff0c;主要包括 二、nginx使用详解 2.1、nginx特点 高性能&#xff…

Android 播放mp3文件

1&#xff0c;在res/raw中加入mp3文件 2&#xff0c;实现播放类 import android.content.Context; import android.media.AudioManager; import android.media.SoundPool; import android.util.Log;import java.util.HashMap; import java.util.Map;public class UtilSound {pu…

【Python】pytorch,CUDA是否可用,查看显卡显存剩余容量

CUDA可用&#xff0c;共有 1 个GPU设备可用。 当前使用的GPU设备索引&#xff1a;0 当前使用的GPU设备名称&#xff1a;NVIDIA T1000 GPU显存总量&#xff1a;4.00 GB 已使用的GPU显存&#xff1a;0.00 GB 剩余GPU显存&#xff1a;4.00 GB PyTorch版本&#xff1a;1.10.1cu102 …

包管理工具--》npm的配置及使用(二)

在阅读本篇文章前请先阅读包管理工具--》npm的配置及使用&#xff08;一&#xff09; 包管理工具系列文章目录 一、包管理工具--》npm的配置及使用&#xff08;一&#xff09; 二、包管理工具--》npm的配置及使用&#xff08;二&#xff09; 三、包管理工具--》发布一个自己…

解决Spring Boot启动错误的技术指南

&#x1f337;&#x1f341; 博主猫头虎&#xff08;&#x1f405;&#x1f43e;&#xff09;带您 Go to New World✨&#x1f341; &#x1f984; 博客首页——&#x1f405;&#x1f43e;猫头虎的博客&#x1f390; &#x1f433; 《面试题大全专栏》 &#x1f995; 文章图文…

【Pytorch】Tutorials个人翻译集合

本文记录Pytorch Tutorials文档的翻译文章集合. 由于本人英语能力有限&#xff08;only-CET4&#xff09;&#xff0c;欢迎指正翻译中的错误。 Introduction to PyTorch 【Pytorch】Pytorch文档学习1&#xff1a;Tensors 【Pytorch】Pytorch文档学习2&#xff1a;DATASETS &a…

Linux基础知识及常见指令

Linux简介及相关概念 什么是Linux&#xff1f; Linux是一个免费开源的操作系统内核&#xff0c;最初由Linus Torvalds于1991年创建。它是各种Linux发行版&#xff08;通常称为“发行版”&#xff09;的核心组件&#xff0c;这些发行版是完整的操作系统&#xff0c;包括Linux内…

Windows 点击任务栏图标没有反应

事情是这样的 我在 Windows 系统点击任务栏的虚拟机&#xff0c;点击没有反应。 怎么办啊 右键任务栏&#xff0c;选择任务管理器 找到对应的服务&#xff0c;鼠标右键&#xff0c;选择最大化。 就可以在屏幕显示了

R语言STAN贝叶斯线性回归模型分析气候变化影响北半球海冰范围和可视化检查模型收敛性...

原文链接&#xff1a;http://tecdat.cn/?p24334 像任何统计建模一样&#xff0c;贝叶斯建模可能需要为你的研究问题设计合适的模型&#xff0c;然后开发该模型&#xff0c;使其符合你的数据假设并运行&#xff08;点击文末“阅读原文”获取完整代码数据&#xff09;。 相关视频…

slog实战:文件日志、轮转与kafka集成

《slog正式版来了&#xff1a;Go日志记录新选择&#xff01;[1]》一文发布后&#xff0c;收到了很多读者的反馈&#xff0c;意见集中在以下几点&#xff1a; 基于slog如何将日志写入文件slog是否支持log轮转(rotation)&#xff0c;如果slog不支持&#xff0c;是否有好的log轮转…

面试设计模式-责任链模式

一 责任链模式 1.1 概述 在进行请假申请&#xff0c;财务报销申请&#xff0c;需要走部门领导审批&#xff0c;技术总监审批&#xff0c;大领导审批等判断环节。存在请求方和接收方耦合性太强&#xff0c;代码会比较臃肿&#xff0c;不利于扩展和维护。 1.2 责任链模式 针对…

FasterNet(PConv)paper笔记(CVPR2023)

论文&#xff1a;Run, Don’t Walk: Chasing Higher FLOPS for Faster Neural Networks 先熟悉两个概念&#xff1a;FLOPS和FLOPs&#xff08;s一个大写一个小写&#xff09; FLOPS: FLoating point Operations Per Second的缩写&#xff0c;即每秒浮点运算次数&#xff0c;或…

ETLCloud制造业轻量级数据中台解决方案

制造业数据处理特点 制造业在业务发展过程中产生大量的业务交易数据以及设备运行过程中的状态数据&#xff0c;但是制造业有别于其他互联网或零售行业&#xff0c;其数据处理具有以下特点&#xff1a; 数据量不大&#xff0c;大部分业务系统的数据库表在1000W以下数据结构复杂…

【Java代码规范】阿里编码规约 VS CheckStyle

全文速览&#xff1a; 1、关于代码编码质量2、如何小成本有效管理企业内的编码规范 2.1 阿里编码规约IDE插件2.2 CheckStyle IDE插件 3、如何在代码提交中检验规范 3.1 阿里编码规约配置git precommit check3.2 CheckStyle配置git precommit check3.3 实践 1、关于代码编码质…