本文学习的是如何在一个 2D map 上展示图层，本文使用的是 ArcGIS Online 的图层。
这次学习用到的图层是 Trailheads，Trails，Parks and Open Spaces。
先把 FeatureLayer 模块加到 require 里面，分别通过url创建点图层（Trailheads），线图层（Trails），面图层（Parks and Open Spaces）；并用 map.add() 方法将图层一一叠加到底图上。
require([ "esri/Map", "esri/views/MapView", "esri/layers/FeatureLayer" ], function(Map, MapView, FeatureLayer) { // Trailheads feature layer (points) var trailheadsLayer = new FeatureLayer({ url: "https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Trailheads/FeatureServer/0" }); map.add(trailheadsLayer); // Trails feature layer (lines) var trailsLayer = new FeatureLayer({ url: "https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Trails/FeatureServer/0" }); map.add(trailsLayer, 0); // Parks and open spaces (polygons) var parksLayer = new FeatureLayer({ url: "https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Parks_and_Open_Space/FeatureServer/0" }); map.add(parksLayer, 0); }）；其中方法 map.add() 的第二个参数本次都使用了0。这个数值代表的是图层描绘的顺序以及图层叠加顺序，0表示该图层是第一层并且将是最快描绘出来。 本文先叠加了点图层，再将线图层加到点图层之前，最后再把面图层加到最前。
到目前为止我们只是简单的叠加了图层，我们还可以通过给图层特征不同的 style 来提高可视化效果。 1）首先要考虑的是选择一种 Renderer，SimpleRenderer 会给所有的特征同样的 symbol，UniqueValueRenderer 会给不同属性值不同的 symbol，而 ClassBreaksRenderer 会给一段阈值内的特征相同的symbol。 2）Labels 可以用来显示属性信息。 3）visualVariables：包括四种，颜色，大小，透明度等， ColorVisualVariable, SizeVisualVariable, OpacityVisualVariable, RotationVisualVariable 4）valueExpression：用表达式来给属性值分类进行 赋与style。
来看一个 SimpleRenderer 的例子：（type 选择 simple）
require([ "esri/Map", "esri/views/MapView", "esri/layers/FeatureLayer" ], function(Map, MapView, FeatureLayer) { var trailheadsRenderer = { type: "simple", symbol: { type: "picture-marker", url: "http://static.arcgis.com/images/Symbols/NPS/npsPictograph_0231b.png", width: "18px", height: "18px" } }； var trailheadsLabels = { symbol: { type: "text", color: "#FFFFFF", haloColor: "#5E8D74", haloSize: "2px", font: { size: "12px", family: "Noto Sans", style: "italic", weight: "normal" } }, labelPlacement: "above-center", labelExpressionInfo: { expression: "$feature.TRL_NAME" } }; var trailheads = new FeatureLayer({ url: "https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Trailheads/FeatureServer/0", renderer: trailheadsRenderer, labelingInfo: [trailheadsLabels] }); map.add(trailheads); }）；再看一个 UniqueValueRenderer 的例子
function createFillSymbol(value, color) { return { value: value, symbol: { color: color, type: "simple-fill", style: "solid", outline: { style: "none" } }, label: value }; } var openSpacesRenderer = { type: "unique-value", field: "TYPE", uniqueValueInfos: [ createFillSymbol("Natural Areas", "#9E559C"), createFillSymbol("Regional Open Space", "#A7C636"), createFillSymbol("Local Park", "#149ECE"), createFillSymbol("Regional Recreation Park", "#ED5151") ] }; var openspaces = new FeatureLayer({ url: "https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Parks_and_Open_Space/FeatureServer/0", renderer: openSpacesRenderer, opacity: 0.20 }); map.add(openspaces, 0); }）；