ArcGIS API for JavaScript开发初探——基本地图组件使用

1、前言

在上一篇我们已经我们已经讲述了第一个地图应用程序的HelloMap的创建过程,这一篇我们来讲述基本地图组件:Home Button、比例尺、鹰眼图的使用方法。

2、基本地图组件

在ArcGIS Js API中对于基本的地图组件API都是已经帮我们封装好的,我们一般只需要知道模块怎么调用,摆放在什么位置就可以了。下面我们先贴出HelloMap的基本代码便于后面讲解内容的开展。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>HelloWord</title>
        <link rel="stylesheet" href="http://js.arcgis.com/3.12/esri/css/esri.css">
        <script src="http://js.arcgis.com/3.12/"></script>
        <script>
              var map ;
              require ([ "esri/map" ,  "dojo/domReady!" ], function ( Map )  {
                 map =  new  Map ( "mapDiv" ,  {
                  center :  [- 56.049 ,  38.485 ],
                  zoom :  3 ,
                  basemap :  "streets"
                });
              });
        </script>
        <style>
            html, body, #mapDiv {
              padding: 0;
              margin: 0;
              height: 100%;    }
        </style>
    </head>
    <body>
        <div id="mapDiv"></div>
    </body>
</html>

2.1、Home Button

2.2、比例尺

2.3、鹰眼图

3、参考链接

https://developers.arcgis.com/javascript/jssamples/widget_home.html

时间: 2024-10-19 16:51:53

ArcGIS API for JavaScript开发初探——基本地图组件使用的相关文章

ArcGIS API for JavaScript开发初探——HelloWord

1.前言 ArcGIS API for JavaScript 3.10版本使用Dojo1.9.1.dgrid升级到0.3.14版本.put-selector version版本升级到0.3.5和xstyle版本升级到0.1.3. 2.建立第一个应用程序HelloWord 2.1 .创建一个简单的HTML文档 首先我们先创建一个简单的Html文档,具体事例如下图: <!DOCTYPE html> <html> <head> <meta charset="u

ArcGIS API for JavaScript开发环境搭建及第一个实例demo

原文:ArcGIS API for JavaScript开发环境搭建及第一个实例demo ESRI公司截止到目前已经发布了最新的ArcGIS Server for JavaScript API v3.9,它提供了更为丰富而又强大的功能.     一.安装前准备 1.ArcGIS Server for JavaScript API各版本下载地址:http://support.esrichina-bj.cn/2011/0223/960.html,我们选择下载最新的"ArcGIS API for Ja

ArcGis API for JavaScript 开发笔记一 加载地图

1.首先要配置GIS 环境 参考资料:看下这些大神的资料: http://blog.sina.com.cn/s/blog_708bacf90100yddk.html http://blog.csdn.net/wufeishimeng/article/category/522004 也可以查看官方的例子: https://developers.arcgis.com/javascript/jssamples/ 查看GIS 官方API https://developers.arcgis.com/jav

Arcgis api for javascript学习笔记-三维地图的飞行效果

其实就只是用到了 view.goTo()  函数,再利用 window.setInterval()  函数(定时器)定时执行goTo().代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scala

创建ArcGIS API for JavaScript的第一个示例程序

原文:创建ArcGIS API for JavaScript的第一个示例程序 在上一篇博客中已经介绍了如何搭建ArcGIS API for JavaScript开发环境,如果您还没有搭建好开发环境的话,参考博客:http://blog.csdn.net/zdw_wym/article/details/48678913. 如果开发环境搭建好了的话,那么今天我们继续来搭建我们的第一个ArcGIS API for JavaScript应用程序. 下面首先将代码贴出来,复制到VS2012中新建的html

arcgis api for javascript 3.16开发(一)

原来一直都在用Flex开发arcgis的地图接口,用的时间很长,用的习惯也顺手,可Flex这个开发工具已经基本要淘汰了,并且地图借助flash的方式加载在浏览器里已经不能适应webgis的快速开发需求,并且在多种客户端下支持度不是很好,所以转向了html5加arcgis api for javascript的开发,用了一段时间下来,感觉还挺好的,所以分享下经验.开发javasript的唯一不好的地方就是所有对象声明的时候都要看下开发文档,不像flex,AE开发都会有提示.我的开发环境是VS201

ArcGIS API for JavaScript 4.2学习笔记[1] 显示地图

ArcGIS API for JavaScript 4.2直接从官网的Sample中学习,API Reference也是从官网翻译理解过来,鉴于网上截稿前还没有人发布过4.2的学习笔记,我就试试吧. 什么是ArcGIS API for JS?这里就不多介绍了,最关键的一点是4.x版本与3.x版本的变化,按官方的意思是重新写了底层. 笔记中规定: ArcGIS API for JavaScript简称AJS 使用CDN(即不配置本地环境)进行测试开发 其余根据需要进行修改.增删. 要将地图显示在h

ArcGIS API for JavaScript学习(1):第一个地图

1.简介 ArcGIS API for JavaScript跟随ArcGIS 9.3同时发布,是ESRI根据JavaScript技术实现的调用ArcGIS Server REST API接口的一组脚本.当前的最新版本是Version 3.20.通过ArcGIS API for JavaScript可以将ArcGIS Server提供的地图资源和其它资源(ArcGIS Online)嵌入到Web应用中. 在ArcGIS API For JS中,esri.Map类是最重要的一个类,Map作为地图图层

初学ArcGIS API for JavaScript

初学ArcGIS API for JavaScript 对于初学者来说,关于esri提供的一些样式和dojo自带的一些样式还是需要有一定的了解,这块在<WebGIS开发从基础到实践>讲解的特别详细,在这里以笔记的形式来帮助自己加以理解和记忆. esri.css样式主要用于ESRI提供的小部件与组件,比如地图.信息框等.此外,还可以引用Dojo提供的样式表,Dojo提供了4组样式,分别是claro\tundra\soria以及nihilo,每种是一组定义用户界面的字体.颜色与大小等设置.在Arc