arcgis api 初始化地图,宽高问题

初始化地图div,宽高设定好,但初始化地图后,宽高都变成了400px,求解

4个回答

猜测是不是初始化地图的方法中有覆盖div尺寸变动的代码,试试初始化地图后再resize容器div一下,看看效果

没问题吧,是不是其他js控制高度了


<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>Get started with MapView - Create a 2D map - 4.1</title>
  <style>
    html,
    body,
    #viewDiv {
      padding: 0;
      margin: 0;
      height: 200px;
      width: 100%;
    }
  </style>

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

  <script>
    require([
      "esri/Map",
      "esri/views/MapView",
      "dojo/domReady!"
    ], function(Map, MapView) {

      var map = new Map({
        basemap: "streets"
      });

      var view = new MapView({
        container: "viewDiv",
        map: map,
        zoom: 4,
        center: [15, 65]
      });

    });
  </script>
</head>

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

版本太低,init文件中会自动设置宽高为400px

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
在arcgis javascript 中map地图的div 总是显示高度400的问题

相关讨论请见: https://geonet.esri.com/thread/107699 If the map node is being created in a dijit/layout/* node then you can listen once to the ‘resize’ event so you can call map.reposition() and map.resize(

Arcgis for JS之地图自适应调整

当浏览器大小发生变化或者地图展示区域的大小发生变化时,地图的自适应调整。

ArcGIS JavaScript API开发的地图—重新布局

上次的布局在开发过程中发现效果不是很理想,特别是在Toc实现以后, 要是图层多了都要拉框,不是很合理。最近把dijit.layout中的控件好好学习了,网上有篇帖子讲了各个布局小部件的用法http://www.oschina.net/question/12_10306,但是感觉只是讲了大概的意思,没有把实际应用中的方法写出来,还是要看大拿的书才行。改进以后的界面代码:

二、ArcGIS API for JavaScript之地图与图层(1)

在 API for js中,图层的概念与传统意义上图层的概念大不相同,这里的图层对应的是一个地图资源,该地图资源中包含许多传统意义上的图层,这里大家需要区别开来。地图中包含不同来源、不同类型的地图资源,针对不同的地图资源,需要有不同的操作。例如地图切片图层的地图资源,虽然其包含了多个图层,但是由于提供的是事先生成的图片,因此不能进行图层操作,而对于动态地图图层的地图资源,可以显示或者隐藏其中的子图层

ArcGIS For JavaScript API Resizable Map(可调整大小的地图)————(十)

描述: 此示例演示如何使用dojox.layout.ResizeHandle小工具来显示一个可调整大小的地图。当你运行这个样本右下角的地图包含了一个调整图片大小。单击并拖动鼠标调整地图的大小的图像。   在线演示:http://help.arcgis.com/en/webapi/javascript/arcgis/samples/map_resize/index.html 参考联接

arcgis配置初始地图范围

该例展示了加载基础底图的方法。例子中采用ArcGIS Online中的缓存服务,地图范围设置为San Francisco,控制代码如下:    var initExtent= newesri.geometry.Extent({"xmin":-13635568.034589134,"ymin":4541606.359162286,"xmax":-13625430.573712826,"ymax

ArcGIS 10.2 JavaScript API本地部署离线开发环境 地图空白的问题

按照网上各位同学的介绍,下载api,部署后,页面上地图总出不来,找了半天终于发现问题所在: 网上一般是这样说的: 打开 arcgis_js_api\3.9\init.js,把"[HOSTNAME_AND_PATH_TO_JSAPI]js/dojo/dojo"替换成 api在本地机器上的部署路径,即 "127.0.0.1/arcgis_js_api/library/3.2/jsapi/",注

【ArcGIS for JavaScript】加载地图,并标注点

代码结构目录: Map hello world html, body, #map { height: 100%; margin: 0; padding: 0; overflow: hidden; } var map; require(["esri/ma

ArcGIS server使用本地api加载地图预览

ArcGIS server的后门

ArcGIS Api for javaScript 4.6 实现一个简单的地图渲染

说明:本人是一个gis小白,由于网上的资料过于专业,当时学习的时候经常看不懂,于是写了一些简单的关于ArcGIS Api for javaScript分享,若该分享中出现错误,希望大家指出,若能帮助到各位,不胜荣幸。&amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html&amp;gt; &amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;utf-8&quot;&amp;gt; &amp;lt;tit...

ArcGIS API For Javascript之地图基本加载与显示,地图切换、缩放、定位、比例尺、鹰眼图、坐标显示、查询搜索功能实现

ArcGIS API For Javascript之地图加载与显示

ArcGIS Api for javaScript 4.6 实现将一个标注显示在地图上

说明:本人是一个gis小白,由于网上的资料过于专业,当时学习的时候经常看不懂,于是写了一些简单的关于ArcGIS Api for javaScript分享,若该分享中出现错误,希望大家指出,若能帮助到各位,不胜荣幸。本文在已经实现了渲染地图的基础上进行,渲染地图请看:https://blog.csdn.net/ResponseBody/article/details/79803269在渲染地图的基...

(九)ArcGIS API For Javascript调用结果地图服务

引言 ArcGIS API调用结果地图服务 1代码实现 2 全部代码 1.引言结果地图服务也是GP服务的一种,当GP服务的结果返回栅格数据时,我们往往使用结果地图服务来对生成的栅格数据进行渲染,如何发布结果地图服务请看:如何发布结果地图服务 本实例是:克里金差值2.ArcGIS API调用结果地图服务首先我们查看一下服务的定义:2.1代码实现 在页面添加地图(略) 创建两个按钮(一个是画点,一个是

arcgis api for js入门开发系列三地图工具栏(含源代码)

上一篇实现了demo的地图加载展示,在上篇实现的基础上,新增了地图工具栏以及通用地图控件功能,比如地图框选缩放、地图漫游、清空、量算工具、地图导航控件、地图比例尺控件、地图鹰眼图等等,总共分为5个部分,截图如下:              1.工具栏,在map.html页面引入工具栏实现需要的js文件        script type="text/javascript"

arcgis for js 加载你的第一张地图

上一节,我们在本地部署完了,下面就让我们一起来踩坑,首先先上一段代码 &amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html lang=&quot;en&quot;&amp;gt; &amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;lt;meta name=&quot;viewport&quot; content=&quot;width=device-width,

使用Arcgis Javascript api 访问其他地图

概述 在最初接触GIS开发的时候,手上没有任何的地图数据,只是简单的把ArcGIS提供的或者国家地理信息中心公开的低分辨率矢量数据使用ArcGIS Server发布成地图服务来使用。慢慢的开始下载Google或者ESRI在线地图瓦片数据,然后自己编写Servlet程序来发布这些瓦片。当然,也有走正规途径的时候,比如购买灵图或者高德的地图,在或者购买其他高校自己制作的海图等。对于上说这些地图,或者

关于arcgis(javascript)开发的地图在IE8下不显示的问题

最近开发arcgis地图时,为了方便调试,使用的是谷歌火狐。显示正常,功能也正常。但是就是部署到生产环境的时候,页面显示空白,没有地图,并且init.js报错this._div为空或不是对象。于是猜测这是由于IE8不兼容导致的,事实果真如此。后来查找资料发现head标签内加入以下内容能让IE8以谷歌内核来解析运行。

arcgis api for js入门开发系列三地图工具栏

    上一篇实现了demo的地图加载展示,在上篇实现的基础上,新增了地图工具栏以及通用地图控件功能,比如地图框选缩放、地图漫游、清空、量算工具、地图导航控件、地图比例尺控件、地图鹰眼图等等,总共分为5个部分,截图如下:      1.工具栏,在map.html页面引入工具栏实现需要的js文件        &amp;lt;script type=&quot;text/javascript&quot; sr...

[WebGIS] 地图坐标偏移问题

WebGIS加载数据时坐标偏移问题。

Arcgis js api调用常用三种地图服务Demo

花了一天的时间来研究Arcgis js api调用常见的三种地图服务,这里简单的整理了一下,希望可以让学习这方面的人少走点弯路

ArcGIS API For Flex(设置地图空间范围)

引用地址:https://developers.arcgis.com/flex/guide/using-extent.htm  本教程描述几种方式设置地图的范围以及如何取得用于其他操作程度。 Setting an extent 设置一个初始化的地图范围区别于默认。图1是默认,图2是设置后的,可以使用extent属性或Extent类 使用 extent 属性 在Map中

ArcGIS API for JavaScript获取地图中心点位置

&amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html&amp;gt; &amp;lt;head&amp;gt; &amp;lt;title&amp;gt;&amp;lt;/title&amp;gt; &amp;lt;link rel=&quot;stylesheet&quot; href=&quot;http://js.arcgis.com/3.12/dijit/themes/claro/claro.css&quot;&amp;gt; &amp;lt;

arcgis api for JavaScript发布切片,地图不显示

    按照arcgis api for JavaScript4.6官方网站提供的方法进行尝试,ArcServer10.1发布的地图本地也能访问,但是一放在HTML中,用TileLayer方法,就是无法获取到地图。无奈尝试使用官方提供的例子中的REST URL进行尝试,发现成功,于是猜测问题出现在ArcServer发布出现问题,进行搜索和尝试,终于发现问题:在发布过程中,选择了默认的设置,没有进行...

离线谷歌卫星地图加载服务中间件调用示例For ArcGIS JS API

1. 说明 水经注离线谷歌卫星地图加载服务中间件可利用离线地图的.dat文件在本地建立服务端,并生成影像、标签、高程等服务地址,可以在ArcGIS API for JavaScript中直接调用该服务地址,并将请求到的服务资源显示在前端,当请求的地图资源不存在可通过网络直接下载缺失的地图,并储存在.dat文件中。   获取更多免费软件、技术加群:329081749

【ArcGis for javascript从零开始】之一 ArcGis加载天地图

现在正在做的项目,需要用ArcGis来加载天地图,由于刚刚接触ArcGis方面,一边学习一边做比较吃力。先把学习到的一点点拿出来现学现卖吧。

用ArcGIS API for JavaScript在地图上绘制圆多边形

问题描述:     借助Arcgis的Api在地图上绘制圆与多边形,查看Api的两个类Circle和Polygon      Api地址:https://developers.arcgis.com/javascript/jsapi/ 解决代码: //画圆画多边形 ArcGIS API for JavaScript require([ "esri/geometry/

(十五)ArcGIS API For Javascript之地图输出

引言 启用PrintingTools 工具 使用PrintingTools 打印地图 1代码实现 2运行结果 3全部代码1.引言      在WebGIS中地图输出是一个比较常用的功能,当我们制图结束时,往往要将我们的地图打印成一张图片保存起来,在ArcGIS API要想实现地图打印,需要借助PrintingTools工具,此工具实质上是一个GP工具,因为是GP工具,所以地图的生成是在服务器端生成的

arcgis api for js入门开发系列十一地图统计图

上一篇实现了demo的叠加SHP图层,本篇新增地图统计图,截图如下: 地图统计图实现的思路如下:利用拓展arcgis api的js文件(MapChartGraphic.js以及MapChartGraphic.js),然后构造统计的数据源,直接调用即可; 1.map.html页面引用地图统计图需要的js文件 dojoConfig = { parseOnLoad...

ArcGIS API for javascript开发笔记 —— 地图打印

前段时间的一个项目用到了地图的打印功能。当时遇到了一个GraphicLayer中TextSymbol汉字打印乱码和文字在地图中过大的问题, 后来经过分析发现,汉字乱码是中文字体的原因,文字太大是由于DPI参数设置过高导致的。下面是dpi为96和300的对比图片: 附上源码: html> html> head> meta charset="utf-8"/>

arcgis-api-for-js-之添加图层到地图及地图服务设置可见图层

1. 前言 ArcGISDynamicMapServiceLayer 类代表动态图层,因此就有很大的属性与方法来操作视图服务。 2. 添加图层到地图 我们使用 addLayer() 方法将图层加载到地图中,代码如下: require(["esri/map","esri/layers/ArcGISDynamicMapServiceLayer",

arcgis api JavaScript打印地图图例显示不正确

问题1:地图上以图层样式以PictureMarkerSymbol的打印不出现或出现被替换在地图上使用图片图标作为样式,是一件很正常的事情。 打印的时候,在被打印的地图上没有看到这个图层。 反复测试后,并没有找到原因,但是掌握了出现的情况。背景:查询时将查询结果加载到地图上,其中图标的样式使用小气球图片png格式。 情况一设置:图层的样式使用PictureMarkerSymbol,生成每一个gra

arcgis api for js入门开发系列四地图查询

备注:由于实现本篇功能的需求,修改了地图数据的dlsearch.mxd,然后更新了地图服务,需要的在文章最后有提供最新的mxd以及源代码下载的 上一篇实现了demo的地图工具栏,本篇新增地图查询功能,包括属性查询和空间查询两大块,截图如下: 属性查询效果图: 空间查询效果图:   谈核心代码实现之前,我大概的讲一讲arcgis for js的地图查询方式,一般来说,总共有三种...

ArcGIS API for JavaScript 设置地图缩放的最大最小的等级

require(["esri/map"], function(Map) { /* code goes here */ }); 初始化Map对象时设置var map = new Map("map", { center: [112, 38], zoom: 8, maxZoom:9,//最大空间等级 minZoom:5,//最小空间等级 basemap: "topo

Arcgis api for js:PrintTemplate可以做地图截图功能

Arcgis api for js:PrintTemplate可以做地图截图功能

arcgis api for js入门开发系列五地图态势标绘(含源代码)

上一篇实现了demo的地图查询功能,本篇新增地图态势标绘模块,截图如下:   本篇核心的在于调用API的Draw工具:https://developers.arcgis.com/javascript/3/jsapi/draw-amd.html require(["esri/toolbars/draw"], function(Draw) { /* code goes here */

ArcGIS API for Flex(三) 地图之间的切换

最近在学习flex,因为我的专业就是GIS(地理信息系统),所以就尝试着从ESRI上学习相关的知识,有不足之处请多多关照 下面是我直接调用ArcGIS的API,功能是地图之间的切换,运行效果图如下

arcgis api for javascript 地图随着所在div大小的变化而改变的resize()事件

首先我们需要先创建一个地图,代码: Resizable Map dojo.require("esri.map"); var map; function init(){ map = new esri.Map("map",{//加载地图 log

ArcGIS Api For Android学习之(二)加载地图

ArcGIS Api For Android 的地图的接入方法和传统的web端的api类似,分为接入切片地图、动态地图和影像地图,其中切片地图分为基于rest的地图服务和本地切片地图。 下面通过一个例子把arcgisonline上世界地图和沈阳地图加载到手机设备上 在eclipse中helloworld工程下res->Layout->main.xml下设计视图中添加个按钮,给按钮命名:  

arcgis for js 从入门到放弃二:dojo初识和arcgis的多种写法

关于arcgis api 和dojo的关系,只需知道该js api是构建于dojo上,从而充分利用dojo来屏蔽各浏览器差异。 这个框架又大又冷门。不过所幸,玩arcgis对dojo不需要懂太多,很多东西用原生的js或jquery就可以实现。

ArcGIS API For Flex(在应用程序中添加web地图)

Add the web map to the application 原文摘录:https://developers.arcgis.com/flex/guide/tutorial-add-a-web-map-to-the-application.htm 这个WebMapUtil类是基于一个给定ID的web map项目信息用来创建地图 ,这个类需要在线的ArcGIS网络地图上工作,也

arcgis api for js 地图分屏实时联动

如题,先上效果:以上效果是在arcgis_js_v320_api上实现的,其他版本请自行测试。主要实现内容:      自定义了mymap类(继承与map类),重写了map的pan和zoom相关的几个方法:        maplinker是主地图,lingkmaps为所有分屏地图;splitmap.js:分屏地图的容器html页面:...

PGIS地图切片与ArcGIS地图切片互调用

文档中介绍了PGIS栅格切片的参数以及切片在线调用规则,与ArcGIS Server的切片机制进行对比,然后在ArcGIS API for flex中调用PGIS切片

arcgis api for js之echarts开源js库实现地图统计图分析

前面写过一篇关于arcgis api for js实现地图统计图的,具体见:http://www.cnblogs.com/giserhome/p/6727593.html 那是基于dojo组件来实现图表统计的,实现的效果一般般;所以,本篇利用arcgis api for js结合echarts实现统计图效果,效果比之前好看,效果图如下: 实现的思路如下: 1.自定义气泡窗口Chart...

Arcgis 控制地图缩放比例

<esri:Map id="myMap" width="100%" height="100%" logoVisible="false" zoomSliderVisible="false" load="onMapCreated(event)" zoomEnd="onMapZoom(event)" bac

ArcGIS for Javascript API 4.X 实现分屏对比中的地图联动功能的实现

分屏对比的关键就是多个地图的联动,本文将介绍通过ArcGIS for Javascript API 4.X来实现分屏对比中的地图联动功能 首先需要创建多个视图对象 //创建一个map var map = new Map({ basemap: 'streets' }) //定义一个数据来存放创建多个view,以便后面来批量进行进行操作 var views=[] //根

arcgis api for js入门开发系列十九 用HTML5 canvas绘制地图

之前一直想使用HTML5技术全新做一套地图API,可是苦于时间和精力,迟迟未有行动。后来下定决心,利用下班和周末做出一个大体框架出来,现在和网友分享一下自己的整体的一个思路和想法。欢迎大家提出宝贵建议,希望把这套API做的更好,有人真正利用起来。DEMO访问地址, 猛击这里。 数据     我们看到的电子地图是多个图层叠加之后的效果,每一个图

web端输出打印地图(ArcGIS api for Javascript)一、地图打印模板的制作

一、地图打印模板的制作      1、Arcgis自带模板          ArcGIS Server10.1及以后版本安装之后自带打印模板,具体位置在 ../arcgis/rest/services/Utilities/PrintingTools/GPServer下的            Export Web Map Task。这是发布后的位置,mxd的位置在..\ArcGIS\Serv

为arcgis for js封装自己的map

将arcgis for js常用功能封装到通用工具

arcgis js api 地图透镜或放大镜 卷帘效果

基于ArcGIS api上实现地图操作特效,包括透镜、放大镜、卷帘功能 阅读源码快速了解实现思路 有问题q-q-541247221

(三)ArcGIS API For Javascript之调用动态地图服务

引言 调用动态地图服务 需求 1根据需求隐藏服务中的某一个图层 11代码解释 2通过属性查询地图服务中的信息 21代码实现 22代码解释 3通过空间查询地图服务中的信息 31代码实现 32代码解释 4补充

立即提问
相关内容推荐