Hi,
I wrote a function before which is to check whether a point where a user clicks intersects with a layer, like:
search.on('search-complete', function(result){
map.emit('click', {mapPoint: results[0].results[0].feature.geometry});
});
Hi Robert, thanks for your reply! I tried it but it doesn't work. I just show you a simple version with your suggestion. How to catch the click event from the map layer? Could you take a look at the sample code here? I cannot get that event if I use view.on().
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
<title>ArcGIS API for JavaScript Tutorials: Create a JavaScript starter app</title>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>
<link rel="stylesheet" href="https://js.arcgis.com/4.16/esri/themes/light/main.css">
<script src="https://js.arcgis.com/4.16/"></script>
<script>
require(["esri/Map", "esri/views/MapView", "esri/widgets/Search"], function (Map, MapView, Search) {
var map = new Map({
basemap: "topo-vector"
});
var view = new MapView({
container: "viewDiv",
center: [-168, 30],
zoom: 3,
map: map
});
var search = new Search({
view: view
});
view.ui.add(search, "top-right");
// search.on('search-complete', function(result){
// map.emit('click', {mapPoint: results[0].results[0].feature.geometry});
// });
search.on('search-complete', function(result)
{
map.emit('click', {mapPoint: result.results[0].results[0].feature.geometry});
view.on("click", function(event)
{
console.log(event.mapPoint);
});
});
});
</script>
Yiqun,
A couple of things about your code does not make sense. You are adding the event listener "view on click" inside the listener for search complete so this would not take affect until you do your second search.
Why are you wanting to emit a view click event? What is your goal?
Also you had in your code map.emit("click". I forgot to change that to view.emit("click"
Hi Robert,
I did change it to view.emit() before I replied to you. You are right that I didn't realize that I added the event listener "view on click" inside the listener for search complete.
I wrote some functions before to listen to user click (view.on("onlick", ...)) on the map so that I can double check whether the clicked point on the map intersects some graphics in another feature layer. Later my user (actually my colleague) wants to check whether an address/latlon intersects with that layer by typing coordinates. So I added the search widget and want to call my previous view.on("click",...) without any modifications. This is why I just want to mimic a kind of mouse click when the search is complete. Any better idea?
Thanks!
The better route would be to have a function that is called from the view on click.
view.on("click", clickListener);
function clickListener(evt){
let pnt = evt.mapPoint;
// the rest of your on click code
}
...
search.on('search-complete', function (result) {
const mp = result.results[0].results[0].feature.geometry;
clickListener({mapPoint: mp});
});
great, thank you!
Hi Robert,
I am trying to do the same to emit click event on search-complete event of search widget. I am using JS 4.16 API. But its not working for me. I am not getting an error.
search.on('search-complete', function(event){
let lat, longt;
if(event.results[0].results[0].feature.geometry.type == 'point') {
lat = event.results[0].results[0].feature.geometry.latitude;
longt = event.results[0].results[0].feature.geometry.longitude;
} else if(event.results[0].results[0].feature.geometry.type == 'polygon') {
lat = event.results[0].results[0].feature.geometry.centroid.latitude;
longt = event.results[0].results[0].feature.geometry.centroid.longitude;
}
let pointVar = new Point({
latitude:lat,
longitude:longt
});
var scrPt = view.toScreen(pointVar);
view.emit("click", {bubbles: true, cancelable: true,mapPoint: pointVar,screenPoint: scrPt});
});