Rychlý tip - Na co jsem klikl?

ReneRubalcava

<\/HEAD>

<\/P>

Foto: pin points | Flickr - Sdílení fotografií!<\/A> <\/SPAN><\/P>

<\/P>

Takže jsem to viděl už několikrát. Máte na své mapě nějaké FeatureLayers.<\/P>

<\/P>

Nastavíte posluchač pro kliknutí na mapu.<\/P>

<\/P>

Kliknete na mapu.<\/P>

<\/P>

Možná máte šest vrstev, ale dostanete zpět jen jeden grafický prvek.<\/P>

<\/P>

Co se to děje?<\/EM><\/STRONG><\/P><\/P>Ok, takže ano, tohle souvisí s tím, kde jsou které vrstvy. Grafické prvky na vaší mapě jsou pravděpodobně

SVG<\/A>. Stane se, že pokud SVG nemá výplň, nemůžete z něj získat událost kliknutí. Můžete však nastavit průhlednost (opacity) na průhlednou a stále získat událost kliknutí, tak to mějte na paměti.<\/P>

<\/P>

Ale je to také webová záležitost. Způsob, jakým fungují SVG grafiky (všechny DOM prvky vlastně), událost kliknutí přichází pouze z horního prvku. Neprochází na další prvky.<\/P>

<\/P>

Takže jste v háji, že?<\/EM><\/P><\/P>Nevrhejte se hned.<\/STRONG><\/P><\/P>Máte tu pár možností. První je použít

QueryTask<\/A>. Můžete jednoduše dotazovat všechny vrstvy a získat výsledky pro prvky na místě, kde jste klikli. To je pěkné čisté řešení a skvěle funguje pro polygony. Body a čáry jsou trochu složitější. Pokud nekliknete přesně tam, kde je bod nebo čára, nedostanete výsledek. Takže můžete vytvořit malý buffer kolem místa, kde jste klikli, pomocí GeometryEngine<\/A>, pokud chcete zkusit získat lepší výsledek. To nechám na vás<\/EM>.<\/P><\/P>Můžete také použít IdentifyTask<\/A>. To vyžaduje trochu více práce při nastavování s FeatureLayers a experimentování s tolerancí, což je podobné bufferu, o kterém jsme mluvili dříve.<\/P>

<\/P>

Osobně si myslím, že QueryTask s bufferovanou geometrií je lepší řešení, ale alespoň máte nějaké možnosti<\/EM>.<\/P><\/P>Takhle by to mohlo vypadat:<\/P><\/P>require([\n  "esri\/_map",\n  "esri\/_layers\/_FeatureLayer",\n  "esri\/_tasks\/_query",\n  "esri\/_tasks\/_IdentifyTask",\n  "esri\/_tasks\/_IdentifyParameters",\n  "dojo\/_promise\/_all",\n  "dojo\/_domReady!"\n], function(Map, FeatureLayer, Query, IdTask, IdParams, all) { \n  var map = new Map("mapDiv", {\n    center: [-118.182, 33.913],\n    zoom: 14,\n    basemap: "topo"\n  });\n  \n  var layer0 = new FeatureLayer("

http:\/\/sampleserver1.arcgisonline.com\/ArcGIS\/rest\/services\/Demographics\/ESRI_Census_USA\/MapServer\/0");\n  \n  var layer1 = new FeatureLayer("http:\/\/sampleserver1.arcgisonline.com\/ArcGIS\/rest\/services\/Demographics\/ESRI_Census_USA\/MapServer\/1");\n  \n  map.addLayers([layer0, layer1]);\n  \n  \/\/- konvenční metoda\n  map.on('click', function(e) {\n    \/\/- jen jeden grafický prvek \n    console.log(e.graphic);\n    \/\/- pojďme být šílení *_*\n    var q = new Query();\n    q.returnGeometry = true;\n    q.outFields = ["*"];\n    q.geometry = e.mapPoint;\n    \/\/- vzdálenost a jednotky jsou pouze pro Hosted Feature Services \n    q.units = "feet";\n    q.distance = 50;\n    \/\/- Dotazovat všechny FeatureLayers\n    var defs = [layer0, layer1].map(function(x) {\n      return x.queryFeatures(q);\n    });\n    all(defs).then(function(results) {\n      console.log("všechny výsledky dotazu", results);\n    });\n    \n    \/\/- Nebo použijte IdentifyTask, super šílené! #_#\n    var idParams = new IdParams();\n    idParams.geometry = e.mapPoint;\n    idParams.mapExtent = map.extent;\n    \/\/- Budete muset experimentovat s tolerancí \n    \/\/- abyste dosáhli požadovaných výsledků\n    idParams.tolerance = 10;\n    idParams.layerOption = IdParams.LAYER_OPTION_ALL;\n    var url = layer0.url.substr(0, layer0.url.lastIndexOf("\\/"));\n    idParams.layerIds = [layer0, layer1].map(function(x) {\n      return x.url.substr(x.url.lastIndexOf("\\/") + 1, x.length);\n    });\n    console.log(idParams);\n    var idTask = new IdTask(url);\n    idTask.execute(idParams).then(function(results) {\n      console.log("výsledky identifikace", results);\n    });\n  });\n });