在使用ArcGIS JavaScript API编写程序的时候，程序员往往需要完成这样一个功能：点击地图上的图形，自动进行专题GIS数据查询，当在地图非图形区域上点击时，自动进行底图兴趣点查询。
由于专题GIS图形是叠加在底图上的，所以我们在处理地图的鼠标点击事件时，就需要根据实际点击的位置和内容来对不同的数据进行查询。
ArcGIS JavaScript API为编程人员分别提供了针对地图对象和图形的两个鼠标点击事件。
下面是示例代码：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" /> 6 <title>Test Map</title> 7 <link rel="stylesheet" href="http://localhost/arcgis_js_api/library/3.17/3.17/dijit/themes/claro/claro.css" /> 8 <link rel="stylesheet" href="http://localhost/arcgis_js_api/library/3.17/3.17/esri/css/esri.css" /> 9 <style> 10 html, body, #ui-map-view { 11 margin: 0; 12 padding: 0; 13 100%; 14 height: 100%; 15 } 16 </style> 17 <script src="http://localhost/arcgis_js_api/library/3.17/3.17/init.js"></script> 18 <script> 19 var myMap; 20 require([ 21 "esri/layers/ArcGISTiledMapServiceLayer", 22 "esri/symbols/SimpleMarkerSymbol", 23 "esri/map", 24 "dojo/on", 25 "esri/graphic", 26 "esri/geometry/Point", 27 "dojo/domReady!" 28 ], function ( TileLayer,SimpleMarkerSymbol, Map, on,Graphic,Point){ 35 var layer = new TileLayer( 36 "https://www.seanpc.com/ags/rest/services/WorldBaseMap/MapServer" 37 ); 38 myMap = new Map("ui-map-view",{ 39 center: [-111.87, 40.57] 40 }); 41 myMap.addLayer(layer); 42 //地图鼠标点击响应事件 43 on(myMap,"click",function(e){ 44 alert("map clicked"); 45 }); 46 47 myMap.on("load", function() {//图形鼠标点击响应事件 48 myMap.graphics.on("click",function(e){ 49 alert("graphic clicked"); 50 e.stopPropagation(); 51 }); 52 var g=new Graphic(); 53 g.setGeometry(new Point([-111.87, 40.57])); 54 var simpleMarkerSymbol = new SimpleMarkerSymbol(); 55 g.setSymbol(simpleMarkerSymbol); 56 myMap.graphics.add(g); 57 }); 58 }); 59 </script> 60 </head> 61 <body class="claro"> 62 <div id="ui-map-view"></div> 63 </body> 64 </html>