ArcGIS API for JavaScript 4.x を使用すると、クリックではなくマウスホバー（pointer-move イベント）でフィーチャの属性情報をポップアップとして表示できます。
以下のコード例は、米国の州境界レイヤーに対してマウスオーバー時にポップアップを表示する実装です。
<!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</title>
<link rel="stylesheet" href="https://js.arcgis.com/4.27/esri/themes/light/main.css" />
<script src="https://js.arcgis.com/4.27/"></script>
<style>
html, body, #mapView {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<script>
require([
"esri/Map",
"esri/views/MapView",
"esri/layers/FeatureLayer"
], function(Map, MapView, FeatureLayer) {
const mapInstance = new Map({
basemap: "topo-vector"
});
const mapView = new MapView({
container: "mapView",
map: mapInstance,
center: [-98, 39],
zoom: 4,
popup: {
autoOpenEnabled: false
}
});
const usaStatesLayer = new FeatureLayer({
url: "https://sampleserver6.arcgisonline.com/arcgis/rest/services/USA/MapServer/2",
outFields: ["state_abbr", "state_name"],
popupTemplate: {
title: "{state_abbr}",
content: "{state_name}"
}
});
mapInstance.add(usaStatesLayer);
mapView.on("pointer-move", (event) => {
mapView.hitTest(event).then((hitResult) => {
const targetGraphic = hitResult.results
.filter(result => result.graphic.layer === usaStatesLayer)
.shift()?.graphic;
if (targetGraphic) {
mapView.popup.open({
location: targetGraphic.geometry.centroid,
features: [targetGraphic]
});
} else {
mapView.popup.close();
}
});
});
});
</script>
</head>
<body>
<div id="mapView"></div>
</body>
</html>