https://developers.arcgis.com/javascrip ... tro-popup/, только без использования локатора адресов, так как его использовать не планирую. Других примеров с событием click к сожалению не нашёл.
Код: Выделить всё
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<title>Title</title>
<link rel="stylesheet" href="https://js.arcgis.com/4.10/esri/css/main.css">
<script src="https://js.arcgis.com/4.10/"></script>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<script>
require([
"esri/Map",
"esri/layers/GraphicsLayer",
"esri/views/MapView",
"esri/Graphic",
"esri/tasks/Locator",
], function (
Map, FeatureLayer, MapView, Graphic, Locator
) {
var locatorTask = new Locator({
url: "https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer"
});
var map = new Map({
basemap: "hybrid"
});
var view = new MapView({
center: [-80, 35],
container: "viewDiv",
map: map,
zoom: 3
});
/*************************
* Create a point graphic
*************************/
var multipoint = {
type: "multipoint",
points: {{ResponseData}},
};
// Create a symbol for drawing the point
var markerSymbol = {
type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
color: [111, 119, 40],
outline: { // autocasts as new SimpleLineSymbol()
color: [1, 255, 255],
width: 1
}
};
var template = {
title: "{{Descr}}"
};
// Create a graphic and add the geometry and symbol to it
var pointGraphic = new Graphic({
geometry: multipoint,
symbol: markerSymbol,
});
// var pointLayer = new GraphicsLayer({graphics: pointGraphic})
// Add the graphics to the view's graphics layer
// view.graphics.addMany([pointGraphic]);
//добавляем слой
var pointLayer = new FeatureLayer();
pointLayer.graphics.add(pointGraphic);
pointLayer.add(pointGraphic);
pointLayer.popup.autoOpenEnabled = true;
pointLayer.popup.popupEnabled = true;
pointLayer.on("click", function(event) {
var lat = Math.round(event.mapPoint.latitude * 1000) / 1000;
var lon = Math.round(event.mapPoint.longitude * 1000) / 1000;
pointLayer.popup.open({
// Set the popup's title to the coordinates of the location
title: "Reverse geocode: [" + lon + ", " + lat + "]",
location: event.mapPoint // Set the location of the popup to the clicked location
});
}
map.add(pointLayer);
});
</script>
</head>
<body>
<h1>Станции и обсерватории</h1>
<div id="viewDiv"></div>
</body>
</html>
