Hello All,
I try to create a module from Sample here:
Display identify results in popup | ArcGIS API for JavaScript
but got error message on "mapPoint" of undefined. Not sure how you send the map click point to module?
or Do you have simple sample for creating a mudule using query or identify? Thank you.
1. index.html
<!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>Identify with Popup</title> <link rel="stylesheet" href="https://js.arcgis.com/3.16/esri/css/esri.css"> <style> html, body, #map { height:100%; width:100%; margin:0; padding:0; } </style> <script type="text/javascript"> var dojoConfig = { packages: [{ name: 'myCustomModule', location: location.pathname.replace(/\/[^/]+$/, '') + '/myCustomModule' }] }; </script> <script src="https://js.arcgis.com/3.16/"></script> <script> var map; require([ "esri/map", "esri/dijit/Popup", "dojo/_base/array", "esri/Color", "myCustomModule/moduleI", "dojo/dom-construct", "dojo/domReady!" ], function ( Map, InfoTemplate, ArcGISDynamicMapServiceLayer, SimpleFillSymbol, SimpleLineSymbol, IdentifyTask, IdentifyParameters, Popup, arrayUtils, Color, moduleI, domConstruct ) { var popup = new Popup({ fillSymbol: new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID, new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([255, 0, 0]), 2), new Color([255, 255, 0, 0.25])) }, domConstruct.create("div")); map = new Map("map", { basemap: "satellite", center: [-83.275, 42.573], zoom: 18, infoWindow: popup }); map.on("click", function(){ moduleI.executeIdentifyTask(); }) }); </script> </head> <body> <div id="map"></div> </body> </html>
2.moduleI.js
define([ "esri/InfoTemplate", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/symbols/SimpleFillSymbol", "esri/symbols/SimpleLineSymbol", "esri/tasks/IdentifyTask", "esri/tasks/IdentifyParameters", "esri/dijit/Popup", "dojo/_base/array", "esri/Color", "dojo/dom-construct", ],function( InfoTemplate, ArcGISDynamicMapServiceLayer, SimpleFillSymbol, SimpleLineSymbol, IdentifyTask, IdentifyParameters, Popup, arrayUtils, Color, domConstruct ){ return{ executeIdentifyTask:function(evt){ var identifyTask, identifyParams; var parcelsURL = "https://sampleserver3.arcgisonline.com/ArcGIS/rest/services/BloomfieldHillsMichigan/Parcels/MapServe..."; map.addLayer(new ArcGISDynamicMapServiceLayer(parcelsURL, { opacity: 0.55 })); identifyTask = new IdentifyTask(parcelsURL); identifyParams = new IdentifyParameters(); identifyParams.tolerance = 3; identifyParams.returnGeometry = true; identifyParams.layerIds = [0, 2]; identifyParams.layerOption = IdentifyParameters.LAYER_OPTION_ALL; identifyParams.width = map.width; identifyParams.height = map.height; identifyParams.geometry = evt.mapPoint; identifyParams.mapExtent = map.extent; var deferred = identifyTask .execute(identifyParams) .addCallback(function (response) { // response is an array of identify result objects // Let's return an array of features. return arrayUtils.map(response, function (result) { var feature = result.feature; var layerName = result.layerName; feature.attributes.layerName = layerName; if (layerName === 'Tax Parcels') { var taxParcelTemplate = new InfoTemplate("", "${Postal Address} <br/> Owner of record: ${First Owner Name}"); feature.setInfoTemplate(taxParcelTemplate); } else if (layerName === 'Building Footprints') { console.log(feature.attributes.PARCELID); var buildingFootprintTemplate = new InfoTemplate("", "Parcel ID: ${PARCELID}"); feature.setInfoTemplate(buildingFootprintTemplate); } return feature; }); }); // InfoWindow expects an array of features from each deferred // object that you pass. If the response from the task execution // above is not an array of features, then you need to add a callback // like the one above to post-process the response and return an // array of features. map.infoWindow.setFeatures([deferred]); map.infoWindow.show(evt.mapPoint); } } }); //define function
Solved! Go to Solution.
You are just calling the method in the module on map click event. Please update the below changes.
map.on("click", function(evt){
moduleI.executeIdentifyTask(evt);
})
Did you copy over the require and function section of your index.html correctly? If so, there's a problem with the agreement of the modules and the arguments
- require([
- "esri/map",
- "esri/dijit/Popup",
- "dojo/_base/array",
- "esri/Color",
- "myCustomModule/moduleI",
- "dojo/dom-construct",
- "dojo/domReady!"
- ], function (
- Map, InfoTemplate, ArcGISDynamicMapServiceLayer, SimpleFillSymbol,
- SimpleLineSymbol, IdentifyTask, IdentifyParameters, Popup,
- arrayUtils, Color, moduleI, domConstruct
- ) {
Sorry paste the wrong one.
Here the one I use:
require([
"esri/map",
"esri/symbols/SimpleFillSymbol",
"esri/symbols/SimpleLineSymbol",
"esri/dijit/Popup",
"dojo/_base/array",
"esri/Color",
"myCustomModule/moduleI",
"dojo/dom-construct",
"dojo/domReady!"
], function (
Map, SimpleFillSymbol,
SimpleLineSymbol, Popup,
arrayUtils, Color, moduleI, domConstruct
) {
You are just calling the method in the module on map click event. Please update the below changes.
map.on("click", function(evt){
moduleI.executeIdentifyTask(evt);
})
Thank you so much.