ArcGIS API for Javascript 3.21地图开发实例（一、图形绘制和删除及popup弹出层）

本文主要是介绍ArcGIS API for Javascript 3.21地图开发实例（一、图形绘制和删除及popup弹出层），希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

前言

Arcgis是一个地理系统的平台，可用来进行数据数据展示或二次开发。这里我们所使用的是Arcgis对于JavaScript的api，也就是web端的api进行开发。我们使用的版本是3.21，这个版本包含了完整的2D地图的api。如果想对3D地图进行开发，可以使用4.4版本的api。在这个demo中，我们要完成如下的几个功能:

基本地图展示
搜索功能
图形绘制
图形点击显示详情
图形删除

在本篇博客的结尾可以看到本例的下载链接。

先来看程序的截图:
首先是页面打开时:

接下来是使用搜索功能时：

绘制的图形：

左键点击图形产生popup：

在右键点击图形的时候弹出删除按钮：

代码

接下来是程序的完整代码。除了引入arcGIS包之外，也引入了jquery包，jqeury在本例中并非必需，主要是用于后面实例的开发。

<!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>Arcgis Demo</title><link rel="stylesheet" href="https://js.arcgis.com/3.21/dijit/themes/claro/claro.css"><link rel="stylesheet" href="https://js.arcgis.com/3.21/esri/css/esri.css"><style>html, body, #map {height: 100%; width: 100%; margin: 0; padding: 0;}#search {z-index: 20;margin: auto;height: 95px;width: 400px;margin: auto;position: absolute;top: 20px;left: 0;right: 0;}#info {top: 200px;color: #444;height: auto;font-family: arial;left: 16px;