把高德地图的ZOOM扩展到20

最新推荐文章于 2023-07-07 14:43:56 发布
最新推荐文章于 2023-07-07 14:43:56 发布
阅读量1.1k 收藏
点赞数 1
文章标签： javascript vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wujize/article/details/106272239
版权

VUE-AMAP地图的zooms在PC端缺省是3-18，在手机上缺省是3-19这个精度对项目中使用是不够的，找了好久，反复测试终端解决，记录一下。

一、VUE-AMAP只要修改引用组件的位置即可

<el-amap class="amap-box"
:amap-manager="amapManager"
:expandZoomRange="expandZoomRange" //必须增加此选项
:zooms="zooms" //把ZOOMS调协为[3,20]
最低0.47元/天 解锁文章
海盐老伍
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
winform加载高德地图
09-11
在本文中，我们将深入探讨如何在C# WinForm...为了进一步扩展功能，你需要学习高德地图的JavaScript API，并在C#中通过WebBrowser控件与JavaScript交互。希望这个教程能帮助初学者快速入门，并激发更多的实践和探索。
C# GMap.net高德地图的用法
06-02
在本文中，我们将深入探讨如何在C#项目中使用GMap.net库与高德地图API进行集成，实现在线和离线地图功能。GMap.net是一个强大的开源库，它提供了多种地图服务提供商，包括高德地图（AMapProvider）。我们将依次介绍...
高德地图随着地图的放大与缩小来显示或者隐藏infoWindow信息窗体
weixin_46031207的博客
05-20 1012
上述代码中，创建了一个位于[116.39, 39.9]位置的Marker，并监听了地图的缩放事件。当地图缩放级别小于10时，将该Marker的信息窗口（使用setInfoWindow()方法）设置为null，从而隐藏信息窗口；当地图缩放级别大于等于10时，重新设置信息窗口（使用new AMap.InfoWindow()方法）并显示该信息窗口。在默认情况下，当点击标记或区域时，信息窗口会弹出并显示相关信息。
移动端H5页面引入高德地图的一些问题记录
123
07-07 348
思路：先让地图的div宽高为200%（自己可根据需求自定义），再使用transform: scale(0.5) translate(-50%, -50%);来进行缩放，简不简单？这时的zoom只能控制地图的缩放，因为移动端的宽度相较于web端还是比较小的，如果让移动端即保证zoom值一样，还显示的范围更大。
el-amap的使用
weixin_41486438的博客
08-23 1万+
el-amap只试用于JSAPI 1.4.15，简易开发试用，JSAPI 2.0版本需原生引入。#1.下载vue-amap。
高德地图调整最大缩放级别
牟云飞的博客
07-19 3万+
zooms 表示地图显示的缩放级别范围。在PC上，默认为[3,18]，取值范围[3-18]；在移动设备上，默认为[3,19],取值范围[3-19] 。 当 expandZoomRange 为 true 时， zooms的最大级别在PC上可以扩大到20级。（移动端还是高清19/非高清20 ） 代码如下： var map = new AMap.Map('container', {
高德地图Web端JavaScript API开发(一)---3D地图显示
Tiger_shl的博客
09-19 1万+
最近高德API新推出了3D地图，JS API 3D 地图是基于矢量地图数据提供的新的地图视图效果，相比 2D 地图增加了对旋转、视角倾斜等地图功能的支持。3D 地图基于 WEBGL 开发，在保证流畅度的同时，增加了对无级别缩放等功能的支持 首先 开启 3D 地图视图效果，需要引用JSAPI v1.4.0以上版本的JSAPI，同时在 Map 初始化的时候给地图添加view
ArcGIS API for JavaScript4.10加载高德地图
01-16
通过这种方式，我们不仅能够加载高德地图的二维地图，还可以根据需求扩展到三维场景。同时，高德地图API还提供了丰富的定位、路线规划等功能，可以与ArcGIS API结合，为用户提供更全面的地理信息服务。 在实际项目...
高德地图使用echarts文档
05-25
同时，你需要获取到ECharts的高德地图实例，这可以通过`this.mycharts?.getModel()?.getComponent('amap').getAMap()`来实现。 以下是一个将ECharts图表绘制在高德地图上的基本示例： ```javascript mycharts....
qt qml使用高德地图的WebAPI获取静态地图
08-03
这个过程涉及到Qt的网络编程、QML的UI设计以及对高德地图API的理解和使用。在实际开发中，还可以根据具体需求进行更复杂的功能扩展，如动态加载地图区域、实时定位等，从而为用户提供更加丰富的地图体验。 在提供的...
【高德地图】调整最大缩放级别
Ning+
10-25 1万+
//初始化地图 var map = new AMap.Map('container', { resizeEnable: true, expandZoomRange:true, zoom:20, //设置初始化级别 zooms:[3,20], //设置缩放级别范围 3-20 级 center: [116.397428, 39.90923] //设置初始化坐标...
vue使用高德地图 zoom 不生效
qq_43642135的博客
07-25 2335
vue使用高德地图 zoom 不生效
高德地图小知识点
u010575303的博客
12-24 1761
1.设置地图放大倍数aMap.moveCamera(CameraUpdateFactory.newLatLngZoom(location, 18));//设置地图放大为18倍，缩放级别是在3-19之间，最大为202.地图移动到某个坐标 aMap.animateCamera(CameraUpdateFactory.changeLatLng(mark.getPosition()));//方法内传
vue 中使用 vue-amap(高德地图) 【'AMapUI' is not defined 】
weixin_42737937的博客
06-15 2万+
业务需求： 1. 点击地图获取经纬度及地址； 2.输入内容搜索获取经纬度及地址; 开始： 使用前 可以先查阅官网:vue-amap 其中比较重要的: 1. vue-amap能够抛开高德原生 SDK 覆盖大多数场景，但对于部分定制化程度较高的场景而言，可能还是需要引入高德原生 SDK 来支持。这章将介绍如何在 vue-amap 中使用高德...
高德地图，设置缩放级别zoom为小数，细化设置缩放颗粒度
Mr_CZL的博客
03-30 1万+
项目中，用到了高德地图，用setFitView()方法设置自适配合适视野后，发现实际展示效果有点小。如下图： 实际是产品经理提出来的，哈哈。so，必须要解决了...... 于是想到了setZoom()方法，只要在渲染最后位置先获取当前缩放比getZoom()， 然后map.setZoom(map.getZoom() + 1)不就行了嘛！ 然并卵，缩放比zoom+1后超出了容器，放大比例太大了。 那么能不能加个小数呢？比如map.setZoom(map.getZoom() + 0.3)？
高德地图中缩放级别(zoom)和比例尺(getScalePerPixel)之间的计算关系
tree_546的专栏
06-03 5万+
高德地图缩放级别（zoom） 高德开放平台的开发文档中，地图缩放级别为(4-20)，如下截图：         实际测试结果为(3-19)，如下截图：     高德地图比例尺（getScalePerPixel）         表示当前缩放比例下，每像素代表的实际地图距离（单位米）。 需求描述         需要计算出在指定缩放比例下计算出当前的比例
高德定位后缩放级别的设置
weixin_33901641的博客
07-22 851
2019独角兽企业重金招聘Python工程师标准>>> ...
百度、google、高德 地图比例尺功能实现（算法&&地图分辨率和zoomlevel之间的关系）
热门推荐
其实并不难,是你太悲观
07-18 6万+
一、什么是比例尺？ 比例尺是表示图上距离比实地距离缩小的程度，因此也叫缩尺。用公式表示为：比例尺=图上距离/实地距离。 例如地图上1厘米代表实地距离500千米，可写成：1∶50,000,000或写成：1/50,000,000。 在当前移动端或是web端地图上显示： baidu   google 图中的公里或英里数会随着黑条宽度的改变而改变，并且它的数值和地图当前区域的地图图层分辨率和
Android高德地图获取当前缩放等级及可视区域四个角的坐标
ulddfhv的专栏
08-22 4898
//获取当前缩放等级(未开启定位图层,在fragment中oncreatview生命周期中无法获取到,可以在Onresume中获取) float zoom = mAMap.getCameraPosition().zoom; VisibleRegion visibleRegion = mAMap.getProjection().getVisibleRegion(); LatLng ...
高德地图javascricpt api
最新发布
07-14
高德地图的JavaScript API提供了一系列功能丰富的接口，可以在网页中嵌入高德地图，并实现地图的交互和功能扩展。以下是一些常用的功能和API示例： 1. 创建地图： ```javascript var map = new AMap.Map('mapContainer', { center: [经度, 纬度], // 地图中心点的经纬度 zoom: 缩放级别 // 地图缩放级别 }); ``` 2. 添加标记点： ```javascript var marker = new AMap.Marker({ position: [经度, 纬度], // 标记点的经纬度 map: map // 将标记点添加到地图上 }); ``` 3. 添加信息窗体： ```javascript var infoWindow = new AMap.InfoWindow({ content: '信息窗体内容', // 信息窗体显示的内容 position: [经度, 纬度] // 信息窗体显示的位置 }); infoWindow.open(map); // 在地图上打开信息窗体 ``` 4. 添加交互控件： ```javascript map.addControl(new AMap.ToolBar()); // 添加工具条控件 map.addControl(new AMap.Scale()); // 添加比例尺控件 map.addControl(new AMap.OverView()); // 添加鹰眼控件 ``` 5. 路径规划： ```javascript var driving = new AMap.Driving({ policy: AMap.DrivingPolicy.LEAST_TIME // 路径规划策略，可选参数 }); driving.search([起点经纬度], [终点经纬度], function(status, result) { // 处理路径规划结果 }); ``` 这些只是一些常用功能的示例，高德地图的JavaScript API还提供了更多的功能和事件处理方法，您可以参考[高德地图JavaScript API文档](https://lbs.amap.com/api/javascript-api/summary/)获取详细的API说明和示例代码。 希望对您有所帮助！如果您有任何进一步的问题，请随时提问。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值