Ⅰ. 在3.X版本中，设置Map对象的 "maxScale" 和 "minScale" 属性

<!DOCTYPE html>

<html>

<head>

    <style type="text/css">

        html, body { margin: 0; padding: 0; height: 100%; width: 100%; }

        #viewDiv{ width:100%;height:100%; }

    </style>

    <link rel="stylesheet" href="https://js.arcgis.com/3.20/esri/css/esri.css">

    <script src="https://js.arcgis.com/3.20/"></script>

</head>

<body>

    <div id="viewDiv"></div>

    <script type="text/javascript">

        var SCALE_MIN = 500000;

        var SCALE_MAX = 6000000;

        var SCALE_DEFAULT = 3000000;

        require(["esri/map", "dojo/domReady!"], function(Map) {

            var map = new Map("viewDiv", {

                "scale": SCALE_DEFAULT,

                "maxScale": SCALE_MIN,

                "minScale": SCALE_MAX,

                "basemap": "topo"

            });

        });

    </script>

</body>

</html>

Ⅱ. 在4.X版本中，"mouse-wheel" 事件结合 evt.stopPropagation() 函数来实现

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">

    <style>

        html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; }

    </style>

</head>

<body>

    <div id="viewDiv"></div>

    <link rel="stylesheet" href="https://js.arcgis.com/4.5/esri/css/main.css">

    <script type="text/javascript" src="https://js.arcgis.com/4.5/"></script>

    <script type="text/javascript">

        var SCALE_MIN = 500000;

        var SCALE_MAX = 6000000;

        var SCALE_DEFAULT = 3000000;

        require(["esri/Map", "esri/views/SceneView", "dojo/domReady!"], function (Map, SceneView) {

            var map = new Map({

                "basemap": "satellite",

                "ground": "world-elevation"

            });

            var view = new SceneView({

                "map": map,

                "scale": SCALE_DEFAULT,

                "container": "viewDiv",

                "center": [103.8000, 34.8000],

            });

            view.then(function(){

                view.on("double-click",function(evt){

                    evt.stopPropagation();

                });

                view.on("mouse-wheel",function(evt){

                    //evt.stopPropagation();

                    //鼠标滚轮缩小

                    if(evt.deltaY > 0 && view.scale > SCALE_MAX){

                        evt.stopPropagation();

                        return false;

                    }

                    //鼠标滚轮放大

                    else if(evt.deltaY < 0 && view.scale < SCALE_MIN){

                        evt.stopPropagation();

                        return false;

                    }

                    if((evt.deltaY > 0 && view.scale > SCALE_MAX) || (evt.deltaY < 0 && view.scale < SCALE_MIN)){

                        console.info(view.scale);

                        console.info(evt);

                    }

                });

            });

        });

    </script>

</body>

</html>

Arcgis api for javascript学习笔记-控制地图缩放比例尺范围(3.2X版本与4.6版本)的更多相关文章

  1. ArcGis API for JavaScript学习——加载地图

    ArcGis API for JavaScript开发笔记——加载地图 在这个例子中使用的离线部署的API(请参见 http://note.youdao.com/noteshare?id=f42865 ...

  2. Arcgis api for javascript学习笔记(4.5版本) - 获取FeatureLayer中的graphics集合

    在Arcgis api for javascript 3.x 版本中,我们可以直接通过某个FeatureLayer对象中的graphics属性获取要素集合. graphics属性 但是在4.x版本中, ...

  3. Arcgis api for javascript学习笔记(4.5版本) - 本地部署及代理配置

    在开发过程中,由于api的文件比较多,没必要每个项目都将api加入到解决方案中.况且在VS中如果将api加入解决方案,在编写css或js代码时,由于智能提示需要扫描脚本等文件,会导致VS很卡.所以个人 ...

  4. Arcgis api for javascript学习笔记(3.2X版本)-初步尝试

    Arcgis api for javascript(3.22版本)官方地址 :https://developers.arcgis.com/javascript/3/ 1. 根据官方示例实现一个简单地图 ...

  5. Arcgis api for javascript学习笔记 - 不改变默认端口(6080)情况下，外网访问Arcgis Server 发布的接口

    Arcgis Server发布的地图服务地址默认端口号是6080,假设本机上只对80端口做了外网映射,在IIS中部署了一个网站绑定了80端口,那么网站中某个页面通过arcgis api for js ...

  6. Arcgis api for javascript学习笔记(4.5版本)-三维地图并叠加天地图标注

    1.三维地图实现 在官网的demo中就有三维地图的实现,如下图所示 <!DOCTYPE html> <html> <head> <meta charset=& ...

  7. Arcgis api for javascript学习笔记(4.5版本)-三维地图实现弹窗功能

    1. 对于Graphic对象,在初始化Graphic对象时设置popupTemplate属性,即可实现点击Graphic时显示弹窗. <!DOCTYPE html> <html> ...

  8. Arcgis api for javascript学习笔记(4.5版本)-三维地图的飞行效果

    其实就只是用到了 view.goTo()  函数,再利用 window.setInterval()  函数(定时器)定时执行goTo().代码如下: <!DOCTYPE html> < ...

  9. Arcgis api for javascript学习笔记(4.6版本) - 二维MapView中的FeatureLayer显示标注

    4.6版本api的FeatureLayer中有提供 labelsVisible 和 labelingInfo 两个属性,设置这两个属性可以实现显示将属性中某个字段作为标注.但是这两个属性只针对三维Sc ...

随机推荐

  1. 微服务实践（五）：微服务的事件驱动数据管理 - DockOne.io

    原文:微服务实践(五):微服务的事件驱动数据管理 - DockOne.io [编者的话]本文是使用微服务创建应用系列的第五篇文章.第一篇文章介绍了微服务架构模式,并且讨论了使用微服务的优缺点:第二和第 ...

  2. 洛谷——P1022 计算器的改良

    https://www.luogu.org/problem/show?pid=1022#sub 题目背景 NCL是一家专门从事计算器改良与升级的实验室,最近该实验室收到了某公司所委托的一个任务:需要在 ...

  3. C语言创建删不掉的目录

    上一篇博客写了一个杀不死的进程,如今再写一个删不掉的目录(文件同理),所谓删不掉不是真的删不掉而是删掉后立即又一次创建. 代码例如以下: #include <stdio.h> #inclu ...

  4. Kinect开发笔记之三Kinect开发环境配置具体解释

            0.前言:        首先说一下我的开发环境,Visual Studio是2013的,系统是win8的64位版本号,SDK是Kinect for windows SDK 1.8版本 ...

  5. WCF学习笔记——对象序列化

    当试图通过Web服务.WCF这样的远程处理技术将一个对象复制到远端时,具有对类型序列化的能力很关键. 一 序列化基础 序列化描述了持久化或传输一个对象的状态到流的过程(.NET将对象序列化到流,流是字 ...

  6. 数据结构与算法实验题 4.2 Who is the strongest

    数据结构与算法实验题 4.2 Who is the strongest ★实验任务 在神奇的魔法世界,召唤师召唤了一群的魁偶.这些魁偶排成一排,每个魁偶都有一个 战斗值.现在该召唤师有一个技能,该技能 ...

  7. 【35.29%】【codeforces 557C】Arthur and Table

    time limit per test1 second memory limit per test256 megabytes inputstandard input outputstandard ou ...

  8. 使用Perl分割文件

    使用Perl分割文件 特性 使用换行作为分界 忽略注释行# 分割存入新指定的文件中 待分割的文件test.lst wwdg/prescaler syscfg/test1 syscfg/test2 ua ...

  9. Linux系统编程_8_进程控制之fork_wait_waitpid函数

    fork函数: #include <unistd.h>        pid_t fork(void); fork用来创建一个子进程: 特点: fork调用后会返回两次,子进程返回0,父进 ...

  10. 1. java.util.concurrent - Java 并发工具包

    1. java.util.concurrent - Java 并发工具包 Java 5 添加了一个新的包到 Java 平台,java.util.concurrent 包.这个包包含有一系列能够让 Ja ...