封面

1. 下载 ArcGIS API for JavaScript

官网地址: https://developers.arcgis.com/javascript/3/

下载地址:http://links.esri.com/javascript-api/latest-download

需要稳定的网络环境注册账号后才可以下载,也可以关注微信公众号 RainCode 后台回复 arcgisapi 获取。

下载完成后解压文件,文件比较大可能需要很长时间进行解压。

解压后文件层级很多。

建议大家使用,arcgis_js_v332_api\arcgis_js_v332_api\arcgis_js_api\library\3.32 文件夹下3.32compact 压缩过的代码(代码是不开源的,直接用压缩的就完事了)。

2. 新建静态文件服务器

我自己使用 Express 自己写的一个静态文件服务器(因为要配置跨域,所以习惯了),大家也可以使用 IIS 、Tomcat 等服务器进行搭建。(Express静态文件服务器放在了 https://github.com/LuckRain7/arcgis-api-for-javascript-vue 仓库中的 static-server 文件中,大家可以去 clone 使用。)

3.32compact 文件夹拷贝到 静态文件夹 public 下,修改一个自己喜欢的名字,我这里修改为 arcgis-3.32

自建静态文件服务器地址为 http://localhost:3000/

2. 修改 [HOSTNAME_AND_PATH_TO_JSAPI] 路径

1、找到以下两个文件

static-server\public\arcgis-3.32\init.js

static-server\public\arcgis-3.32\dojo\dojo.js

2、用编辑器打开,搜索 [HOSTNAME_AND_PATH_TO_JSAPI]

3、将两个文件中的 baseUrl 内容都改为 http://localhost:3000/arcgis-3.32/dojo


baseUrl

3. 测试

复制一下代码到 HTML 文件中,将其中 linkscript 标签地址修改为定义的地址,打开文件进行测试,出现地图则表示本地部署成功。

<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>test arcgis </title>
<style>
body,
html {
margin: 0;
padding: 0;
height: 100%;
width: 100%;
} #test {
height: 100%;
width: 100%;
}
</style>
<link rel="stylesheet" href="http://localhost:3000/arcgis-3.32/esri/css/esri.css">
<script src="http://localhost:3000/arcgis-3.32/init.js"></script>
</head> <body>
<div id="test"> </div> <script>
require(["esri/map"], function (Map) {
var map = new Map("test", {
center: [-118, 34.5],
zoom: 8,
basemap: "topo"
});
});
</script>
</body> </html>

推荐阅读

您的关注是莫大的鼓励

本文使用 mdnice

vue + ArcGIS 地图应用系列一:arcgis api本地部署(开发环境)的更多相关文章

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

    原文:ArcGIS API for JavaScript开发环境搭建及第一个实例demo ESRI公司截止到目前已经发布了最新的ArcGIS Server for JavaScript API v3. ...

  2. ArcGIS JavaScript API本地部署离线开发环境[转]

    原文地址:http://www.cnblogs.com/brawei/archive/2012/12/28/2837660.html 1 获取ArcGIS JavaScript API API的下载地 ...

  3. ArcGIS API for JavaScript开发环境搭建与发布以及基本功能实现

    1.背景介绍 ArcGIS API for JavaScript 咱这就不介绍了,具体可看ESRI中国的介绍:http://support.esrichina.com.cn/2011/0223/960 ...

  4. ArcGIS 10.2 JavaScript API本地部署离线开发环境

    1 获取ArcGIS JavaScript API API的下载地址http://support.esrichina.com.cn/2011/0223/960.html,在下载页面会看到api和sdk ...

  5. Android 百度地图API(01)_开发环境 HelloBaiduMap

    转载于:http://blog.csdn.net/lmj623565791/article/details/37729091 转载于:http://blog.csdn.net/crazy1235/ar ...

  6. 我的Android 4 学习系列之开始入手:配置开发环境与理解Hello World!

    目录 如何安装Android SDK.创建开发环境和调试项目 移动设计中一些注意事项 使用Android虚拟设备.模拟器和其他开发工具 如何安装Android SDK.创建开发环境和调试项目 下载和安 ...

  7. 关于vue项目中axios跨域的解决方法(开发环境)

    1.在config文件中修改index.js proxyTable: { "/api":{ target: 'https://www.baidu.com/muc/',//你需要跨域 ...

  8. 【HDFS API编程】开发环境搭建

    使用HDFS API的方式来操作HDFS文件系统 IDEA Java 使用Maven来管理项目 先打开IDEA,New Project 创建GAV然后next 默认使用的有idea内置的Maven,可 ...

  9. Microsemi Libero系列教程(一)——Libero开发环境介绍、下载、安装与注册

    前言 相比与Xilinx和Altera在国内的市场,Microsemi的FPGA在国内应用很少很少,网上几乎没有详细的教程,刚开始使用时,遇到了各种问题,自己也走了不少弯路.本系列教程以Libero ...

随机推荐

  1. (C++ Error: Incompatible types in assignment of ‘char*’ to ‘char [2])

    in C++, cannot assign a pointer to an array. c++中char*与char[]不是一种类型,但是在C里面可以,所以尽量使用C++中的类,如string, v ...

  2. 面试官: 说说你对async的理解

    大家好,我是小雨小雨,致力于分享有趣的.实用的技术文章. 内容分为翻译和原创,如果有问题,欢迎随时评论或私信,希望和大家一起进步. 分享不易,希望能够得到大家的支持和关注. TL;DR async是g ...

  3. 【php】错误日志处理

    一. 错误处理: a) 在写程序的过程当中,遇到错误时,你的反应?可能比较急躁,比较烦 b) 遇到错误后:一别哭,二别闹,三别上吊,四别尿……二. 你可能会遇到的错误: a) 语法错误 i. 语法错误 ...

  4. Spring(二):初始值赋值

    依赖注入 1.构造器注入 见spring简介最后一大点. 2.Set方式注入 依赖注入:Set注入 依赖:bean对象的创建依赖于容器. 注入:bean对象的所有属性,由容器注入. bean ,里面属 ...

  5. MTK Android Driver :Memory

    型号配置: 1.CUSTOM_MEMORY_HDR(需要确认是否是MTK认证的flash ic) mediatek\custom\$(PROJECT)\preloader\inc\custom_Mem ...

  6. Linux 磁盘管理篇,连接文件

    连接文件分为两种 1.像Window类似的快捷方式的文件 2.通过文件系统的inode来产生新的文件名而不是新文件(硬连接) 创建连接文件            ln 创建连接文件的快捷方式      ...

  7. Hadoop在Ubuntu的安装和使用

    由于小编在本学期有一门课程需要学习hadoop,需要在ubuntu的linux系统下搭建Hadoop环境,在这个过程中遇到一些问题,写下这篇博客来记录这个过程,并把分享给大家. Hadoop的安装方式 ...

  8. Python操作rabbitmq系列(六):进行RPC调用

    此刻,我们已经进入第6章,是官方的最后一个环节,但是,并非本系列的最后一个环节.因为在实战中还有一些经验教训,并没体现出来.由于马上要给同事没培训celery了.我也来不及写太多.等后面,我们再慢慢补 ...

  9. mysql 单机多实例配置

    如果你想在一台机器上进行主从配置实验,本篇可以帮助你实现愿望 [client] #password = your_password port = 3306 socket = /tmp/mysql.so ...

  10. 小说免费看!python爬虫框架scrapy 爬取纵横网

    前言 文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理. 作者: 风,又奈何 PS:如有需要Python学习资料的小伙伴可以加点击下方 ...