arcgis api for javascript - 最基本的地图加载
为大家贴贴最基本的地图加载:
一. API 根据Dom树上节点的 ID 确定 Map 的显示位置;
二. setBasemap 方法可得到一些ArcGIS制作好的底图,例如: "streets" , "satellite" , "hybrid", "topo", "gray", "oceans", "national-geographic", "osm";
三. setEXtent 方法可设置地图的显示区域;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title> Demo </title>
<link rel="stylesheet" href="http://js.arcgis.com/3.10/js/esri/css/esri.css">
<script type="text/javascript" src="http://js.arcgis.com/3.9/"></script>
<style>
html,body,#mapDiv
{
width: 100%;
height: 100%;
}
</style>
<script>
require([
"esri/map",
"esri/geometry/Extent"
], function(){
var map = new esri.Map("mapDiv");
map.setBasemap("osm");
var bounds = new esri.geometry.Extent({
"xmin":118.363523,"ymin":29.219302,"xmax":119.508848,"ymax":30.073848,
"spatialReference":{"wkid":4326}});
map.setExtent(bounds);
});
</script>
</head>
<body>
<div id="mapDiv"></div>
</body>
</html>
补充:
1.地图初始化时即可完成各种属性的设置,new Map(divId, options?);
例如:var map = new Map(“mapDiv”,{ basemap: "osm" , extent: bounds});
2.欲加载已发布的服务,只需新建图层并加入map 即可;
例如: var layer = new esri.layers.ArcGISDynamicMapServiceLayer( url ); map.addLayer(layer);
效果:
arcgis api for javascript - 最基本的地图加载的更多相关文章
- ArcGIS API for JavaScript(4.x)-加载天地图
ArcGIS API for JavaScript(3.x)如何加载天地图<ArcGIS API for Javascript 加载天地图(经纬度投影) - 张凯强 - 博客园>这篇文章已 ...
- arcgis api for JavaScript _加载三维图层(scene layer)
arcgis api for JavaScript _加载三维图层(scene layer) arcgis api for JavaScript 4.x 版本增加对三维的支持. 关于三维图层(sce ...
- 基于ArcGIS API for Javascript的地图编辑工具
最近工作上需要用ArcGIS API for Javascript来开发一个浏览器上使用的地图编辑工具,分享一下一些相关的开发经验. 我开发的地图编辑工具是根据ESRI提供的例子修改而来的,参考的例子 ...
- ArcGIS API for JavaScript(2)-ArcGIS Server发布要素图层服务
1.前言 上一篇该系列的文章我们主要讲了一下基础Web地图搭建,这篇我们主要讲一下ArcGIS Server发布服务,并且如何调用服务.将自己的数据加载到Web地图当中来,实现Web端浏览数据. 2. ...
- ArcGIS API for JavaScript 4.0(一)
原文:ArcGIS API for JavaScript 4.0(一) 最近ArcGIS推出了ArcGIS API for JavaScript 4.0,支持无插件3D显示,而且比较Unity和Sky ...
- ArcGIS API for JavaScript开发环境搭建及第一个实例demo
原文:ArcGIS API for JavaScript开发环境搭建及第一个实例demo ESRI公司截止到目前已经发布了最新的ArcGIS Server for JavaScript API v3. ...
- 创建ArcGIS API for JavaScript的第一个示例程序
原文:创建ArcGIS API for JavaScript的第一个示例程序 在上一篇博客中已经介绍了如何搭建ArcGIS API for JavaScript开发环境,如果您还没有搭建好开发环境的话 ...
- RequireJS加载ArcGIS API for JavaScript
1.在main.js中配置ArcGIS API for JavaScript require.config({ paths : { //arcgisJS "esri": " ...
- arcgis api for javascript 3.16开发(一)
原来一直都在用Flex开发arcgis的地图接口,用的时间很长,用的习惯也顺手,可Flex这个开发工具已经基本要淘汰了,并且地图借助flash的方式加载在浏览器里已经不能适应webgis的快速开发需求 ...
随机推荐
- [整理] Nginx Location 匹配规则
目录 规则语法 location 分类 匹配顺序: 扩展 location / {}和 location =/ {}的区别 如何快速测试 规则语法 语法 匹配规则 空 普通匹配(遵循最大前缀匹配规则, ...
- HTML5 Canvas核心技术 图形、动画与游戏开发学习总结
save 和 restore 函数的应用 保存canvas和恢复canvas clip函数的应用 文字的绘制 背景图片的绘制 离屏canvas 基于时间的运动
- Python中的正斜杠/与反斜杠\
知识点: 1. "/"左倾斜是正斜杠,"\"右倾斜是反斜杠,可以记为:除号是正斜杠 2. 对于目录分隔符,Unix和Web用正斜杠/,Windows用反斜杠\. ...
- [转] maven打包可运行的fat-jar的简单方法
[From] https://blog.csdn.net/tearsky253/article/details/75948721 问题 在使用“mvn package”命令编译application之 ...
- C回调函数
转自:https://segmentfault.com/a/1190000008293902?utm_source=tag-newest 在面试的时候被问到什么是回调函数,我是属于会用但不懂概念的那类 ...
- ionic3打包打包安卓apk详细过程以及遇到的问题
1.jdk和sdk的安装以及环境变量配置参考打包详解 上述连接已经从下载安装jdk以及sdk的环境变量配置到打包的流程以及很详细了.但是在我自己安装打包的过程中遇到了这篇文章中没有遇到的问题,下面图文 ...
- redux-thunk, redux-logger 阮一峰 ( react中间件 )
http://www.ruanyifeng.com/blog/2016/09/redux_tutorial_part_two_async_operations.html Redux 入门教程(二):中 ...
- (转)nginx location在配置中的优先级
原文:https://www.bo56.com/nginx-location%E5%9C%A8%E9%85%8D%E7%BD%AE%E4%B8%AD%E7%9A%84%E4%BC%98%E5%85%8 ...
- webpack查缺补漏
webpack是模块化打包工具,通过webpack,可以使得我们更加方便地组织代码.压缩.转译等等. 但是学习webpack也需要一定的成本,这里记录使用webpack许久以来一些模糊的知识点,方便以 ...
- JAVA学习6:用Maven创建Spring3 MVC项目
一. 环境 spring-framework-3.2.4.RELEASE jdk1.7.0_11 Maven3.0.5 eclipse-jee-juno-SR2-win32 二. ...