说明、这篇博文的示例代码 地图充满body

arcgis api for javascript iis怎么离线部署 请参考我前面的博文

1、运行效果

3、HTML代码

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Scalebar应用</title>
<link rel="stylesheet" type="text/css" href="http://localhost/arcgis_js3_api/library/3.3/jsapi/js/dojo/dijit/themes/claro/claro.css"/>
<link rel="stylesheet" type="text/css" href="http://localhost/arcgis_js3_api/library/3.3/jsapi/js/esri/css/esri.css" /> <style>
html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
#map{padding:0;}
</style> <script>var dojoConfig = { parseOnLoad: true };</script> <script type="text/Javascript" src="http://localhost/arcgis_js3_api/library/3.3/jsapi/init.js"></script>
<script type="text/Javascript">
var MyMap;
var MyTiledMapServiceLayer;
dojo.require("dojo.parser");
dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.ContentPane");
dojo.require("esri.map");
dojo.require("esri.dijit.Scalebar");
var map; function init() {
map = new esri.Map("map", {
basemap: "topo", // 指定的地图底图.有效选项:"streets","satellite","hybrid","topo","gray","oceans","national-geographic","osm".
center: [-116.093, 34.218],
zoom: 7
}); dojo.connect(map, "onLoad", function (theMap) {
var scalebar = new esri.dijit.Scalebar({
map: map, // 必须的
scalebarUnit: "english" // 指定比例尺单位,有效值是"english" or "metric".默认"english"
});
});
} dojo.ready(init); // 初始化加载
</script>
</head> <body class="claro">
<div data-dojo-type="dijit.layout.BorderContainer"
data-dojo-props="design:'headline', gutters:false"
style="width: 100%; height: 100%; margin: 0;"> <div id="map"
data-dojo-type="dijit.layout.ContentPane"
data-dojo-props="region:'center'"
style="overflow:hidden;">
</div> </div>
</body> </html>

其中代码

      map = new esri.Map("map", {
basemap: "topo", // 指定的地图底图.有效选项:"streets","satellite","hybrid","topo","gray","oceans","national-geographic","osm".
center: [-116.093, 34.218],
zoom: 7
});
也可以替换为下面的形式

map = new esri.Map("map", { center: [-122.445, 37.752], zoom: 4 });
MyTiledMapServiceLayer = new esri.layers.ArcGISTiledMapServiceLayer
("http://localhost/arcgis/rest/services/DZDT2012/MapServer");
map.addLayer(MyTiledMapServiceLayer);

注意:直接拷贝代码的时候 要把引用文件的

arcgis_js3_api修改为
arcgis_js_api
例如:
 <link rel="stylesheet" type="text/css" href="http://localhost/arcgis_js3_api/library/3.3/jsapi/js/dojo/dijit/themes/claro/claro.css"/>修改为
<link rel="stylesheet" type="text/css" href="http://localhost/arcgis_js_api/library/3.3/jsapi/js/dojo/dijit/themes/claro/claro.css"/>
因为我本机IIS文件夹名称是
arcgis_js3_api

ArcGIS Scalebar 比例尺的更多相关文章

  1. ArcGIS Scalebar 比例尺 充满div

    说明:本篇博文地图充满div,上一篇博文是充满整个body 运行效果: 2.HTML代码 <!DOCTYPE html> <html> <head> <met ...

  2. ArcGIS中国工具应用:固定比例尺固定纸张批量打印

    ArcGIS中国工具应用:固定比例尺固定纸张批量打印 下载地址:http://files.cnblogs.com/files/gisoracle/a3batchprint.zip 固定A3,比例尺1: ...

  3. ArcGIS Server 缓存服务增加新比例尺缓存

    win10 + Server 10.4 +  ArcMap 10.4  操作简单说明: ①窗口上方Customize栏→Toolbars→ Customize→ 搜索到 manege map serv ...

  4. Arcgis api for javascript学习笔记-控制地图缩放比例尺范围(3.2X版本与4.6版本)

    Ⅰ. 在3.X版本中,设置Map对象的 "maxScale" 和 "minScale" 属性 <!DOCTYPE html> <html> ...

  5. ArcGIS Server开发教程系列(8)ArcGIS API for Javascript-控件(小部件)

    1.     鹰眼 OverviewMap小部件用于在其关联的主地图内较清楚的当前鸟瞰图的范围.当主地图范围变化时,鹰眼图会自动在其空间内更新范围以保持和地图的当前范围保持一致,当鹰眼图空间的地图范围 ...

  6. ArcGIS Server 开发之鹰眼地图的实现

    鹰眼简单点说就是地图的联动,鹰眼的全称是OverviewMap,在ERSI提供的API包中,在dijit中进行类的调用.查了很多的资料,总结一下: 具体的代码: <!DOCTYPE html&g ...

  7. ArcGIS+API+for+JS测距

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. ArcGIS API for JavaScript 学习笔记(一)

    终于开始了 噩梦一般的ArcGIS 我特别不习惯这种结构化的程序写法 写起来特别吃力 特别是把几个功能整合到同一个页面去的时候. 写程序的时候,一般我喜欢先写个Demo然后再把Demo上面的功能加到页 ...

  9. ArcGIS API for Silverlight开发入门

    你用上3G手机了吗?你可能会说,我就是喜欢用nokia1100,ABCDEFG跟我 都没关系.但你不能否认3G是一种趋势,最终我们每个人都会被包裹在3G网络中.1100也不是一成不变,没准哪天为了打击 ...

随机推荐

  1. 使用ffmpeg截取视频封面并批量上传

    需求:将视频文件压入zip包,然后上传服务器.服务器对zip解压,使用bat/shell,使用ffmpeg对视频进行封面截取.再使用OSS对视频和封面进行批量上传.最后将信息存入数据库 遇到的问题 1 ...

  2. 【Java】String和Date、Timestamp之间的转换

    首先,定义一个Format的日期格式: SimpleDateFormat df = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); 一.S ...

  3. elasticsearch 基础性操作

    1 基础概念 Elasticsearch是一个近实时的系统,从你写入数据到数据可以被检索到,一般会有1秒钟的延时.Elasticsearch是基于Lucene的,Lucene的读写是两个分开的句柄,往 ...

  4. ubuntu12.04下sun-java1.6-jdk配置

    1. 下载安装 2. 设置安装的默认程序 $ sudo update-alternatives --install /usr/bin/java java /usr/lib/jvm/jdk1.7.0_2 ...

  5. Mysql和SqlServer互相转换

    环境: Windows XP sp2 MS SQL Server 2OOO sp1 MySql 5.0.41 1:MSSQLServer数据库导入到MySql数据库 步骤: 1.安装mysql数据库的 ...

  6. eclispe查看jdk源码后特别卡顿导致未响应解决

    第一步:Eclipse -> Preferences -> General -> Startup and Shutdown.不要勾选 RSE UI. 第二步:Eclipse -> ...

  7. <p>在我们的实际软件项目中,管理团队事实上比写代码或者实现一个客户的需求更为的有挑战性。由于编程实际上是和机器打交道,而和机器打交道,仅仅要你符合机器预定的逻辑,</p>

    在我们的实际软件项目中,管理团队事实上比写代码或者实现一个客户的需求更为的有挑战性. 由于编程实际上是和机器打交道.而和机器打交道,仅仅要你符合机器预定的逻辑, 一步步迈向解决这个问题的道路上一点都不 ...

  8. Java中的split函数的用法

    Java中的 split  函数是用于按指定字符(串)或正则去分割某个字符串,结果以字符串数组形式返回: 例如: String str="1234@abc"; String[] a ...

  9. 【hadoop之翊】——windows 7使用eclipse下hadoop应用开发环境搭建

    由于一些缘故,这节内容到如今才写.事实上弄hadoop有一段时间了,能够编写一些小程序了,今天来还是来说说环境的搭建.... 说明一下:这篇文章的步骤是接上一篇的hadoop文章的:http://bl ...

  10. 当半年不碰的webpack + vuejs项目重见天日时遇到的神坑!

    半年前的Vuejs项目,由于webpack环境一直是1.0的(现在是webpack4.0),倒不是说不会升级或者不敢升级. 总而言之.在我再次启动这个项目时: npm run dev / npm ru ...