在使用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 width: 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>