在二维地图上叠加业务数据是一个最基本的功能需求。API提供了很多类型的图层来帮助开发者添加所需要的业务数据。其中最常用的是以下两类：
1. MapImageLayer：
- 跟它的名字一样“地图图像图层”，字面理解是负责加载一份地图图像的图层。对应加载ArcGIS Server发布的MapServer服务，每次客户端请求地图服务的时候，GIS服务器根据请求的地图范围，将该范围内的数据生成一张图片返回客户端。它的优点是数据量大时(百万级别)，由于由GIS服务器处理，所以速度很快。另外，由于返回的是图片，所以在客户端获取不到要素的信息(坐标和属性)。如果需要获取要素的信息，需要通过空间查询完成。
- 构造一个MapImageLayer对象时，地图服务的地址是MapServer，完整的地址格式类似
http://sampleserver6.arcgisonline.com/arcgis/rest/services/USA/MapServer”
2. FeatureLayer
- FeatureLayer：要素图层，加载的是要素对象信息。对于加载ArcGIS Server发布的FeatureServer，每次客户端请求服务的时候，GIS服务器将根据请求的地图范围，返回该范围内的数据给客户端，注意返回的是要素的信息，包括几何坐标、属性信息和符号，由客户端对要素进行符号化。
- 构造一个FeatureLayer对象时，地图服务的地址是FeatureServer中的一个图层，完整的地址格式类似：
http://services.arcgis.com/V6ZHFr6zdgNZuVG0/ArcGIS/rest/services/Oklahoma_earthquakes/FeatureServer/0”
- 适合少量数据(2000条数据是Esri建议的最大显示要素数)的可视化，可以配合热点图、聚合图功能使用。另外，由于返回的信息中包含了属性信息，所以开发者习惯的直接点击地图上的要素弹出该要素的信息的需求，可以直接满足而不需要再去执行空间查询。之所以FeatureLayer不建议返回过多的要素在客户端渲染，是由于目前的API不管是符号化的接口还是渲染器，主要采用SVG来渲染。SVG有自己的优势，譬如内存占用率低，渲染性能略高，并且用户使用浏览器的内置的缩放功能时符号不会变模糊。但是在图形数量比较多的时候，就会导致浏览器加载卡顿的问题。
- 基于上述问题，Esri目前正在推出基于WebGL的FeatureLayer渲染，以提高要素量较大的情况下的渲染性能表现，并在动画和视觉特效方面有所推进，目前在官网上推出的Sample 对18万个要素进行渲染，效果非常给力。
以下这个Demo，加载了MapImageLayer和FeatureLayer，代码很简单，我们直接看代码：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" />
<title>二维地图开发-叠加业务图层</title>
<link rel="stylesheet" href="http://192.168.1.144/4.6/esri/css/main.css" />
<style>
html,
body,
#mapViewDiv {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
</style>
<script src="http://192.168.1.144/4.6/dojo/dojo.js"></script>
<script>
var myMap, mapView;
require([
"esri/Basemap",
"esri/layers/TileLayer",
"esri/Map",
"esri/views/MapView",
"esri/layers/MapImageLayer",
"esri/layers/FeatureLayer",
"dojo/domReady!"
], function (Basemap, TileLayer, Map, MapView, MapImageLayer,FeatureLayer){
/**
**TileLayer接口负责加载ArcGIS Server发布的MapServer缓存切片服务
**http://map.geoq.cn/arcgis/rest/services/ChinaOnlineCommunity/MapServer是GeoQ提供的以中国区域为主的缓存切片服务
**TileLayer将作为Basemap对象的一个图层添加到Map对象中。
**/
var layer = new TileLayer({
url: "http://map.geoq.cn/arcgis/rest/services/ChinaOnlineCommunity/MapServer"
});
/**
**Basemap:负责管理所有自定义的基础地图
**我们可以把所有的基础地图都放在Basemap对象中
**每个基础地图服务在Basemap对象中都作为一个图层
**/
var customBasemap = new Basemap({
baseLayers: [layer],
title: "基础地图",
id: "gisBasemap"
});
myMap = new Map({
basemap: customBasemap
});
mapView = new MapView({
center: [-102.56, 37.55], //初始化地图居中时的中心经度、维度
container: "mapViewDiv", //地图展示区域，对应页面上的DIV
map: myMap, //MapView包含Map对象
zoom: 5 //初始显示地图级别
});
//美国行政区划地图，以MapServer添加到地图中，调用的是MapImageLayer接口，每次请求时服务器都将根据请求的地图范围动态出图，和缓存切片地图虽然也是MapServer，但是没有预先做好缓存切片。
var usaLayer = new MapImageLayer({url:"http://sampleserver6.arcgisonline.com/arcgis/rest/services/USA/MapServer"});
myMap.add(usaLayer);
//2000年以来俄克拉何马州地震分布图，以FeatureServer添加到地图中，调用的是
var quakesUrl ="http://services.arcgis.com/V6ZHFr6zdgNZuVG0/ArcGIS/rest/services/Oklahoma_earthquakes/FeatureServer/0";
var quakesLayer = new FeatureLayer({url: quakesUrl});
myMap.add(quakesLayer);
});
</script>
</head>
<body>
<div id="mapViewDiv"></div>
</body>
</html>运行的效果：
地图中部的淡红色是FeatureLayer加载的地震数据，其他的数据是MapImageLayer加载的数据。这份代码需要注意的一点是：new一个图层对象时，构造函数接受的是一个JSON对象，在这个JSON对象里，制定服务的URL地址。譬如MapImageLayer的构造函数：
var usaLayer = new MapImageLayer({url:"http://sampleserver6.arcgisonline.com/arcgis/rest/services/USA/MapServer"});这个和3.x API系列有所区别，3.x系列的API构造函数可以直接将服务的URL地址传入。