Solved! Go to Solution.
The links above didn't work for me, but here's some code that worked for me with the 3.13 version of the API
//show cursor as pointer when hovered over clickable graphic/feature map.on('load', function() { graphicLayer.enableMouseEvents(); graphicLayer.on("mouse-over", function(){ map.setMapCursor("pointer"); }); graphicLayer.on("mouse-out", function(){ map.setMapCursor("default"); }); });
The graphicLayer object could be map.graphics, a feature layer, or some other graphics layer that has been added to the map. Hope folks find this helpful!
New to the API and javascript. Any help would be appreciated. Thanks
<!DOCTYPE html>
<html>
<head>
<title>Create a Web Map</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" type="text/css" href="http://js.arcgis.com/3.14/esri/css/esri.css">
<style>
html,body,#mapDiv,.map.container{
padding:0;
margin:0;
height:100%;
}
</style>
<script>var dojoConfig = { parseOnLoad:true };</script>
<script src="http://js.arcgis.com/3.14compact/"></script>
<script>
var map,
webmapId = "dd487118ba2f4597a0ebc2bcaafb3fb4";
require([
"esri/map",
"esri/graphic",
"esri/arcgis/utils",
"dojo/domReady!"
], function(Map, graphic, arcgisUtils){
arcgisUtils.createMap(webmapId, "mapDiv").then(function (response) {
map = response.map;
//show cursor as pointer when hovered over clickable graphic/feature
map.on('load', function() {
graphicLayer.enableMouseEvents();
graphicLayer.on("mouse-over", function(){
map.setMapCursor("pointer");
});
graphicLayer.on("mouse-out", function(){
map.setMapCursor("default");
});
});
});
});
</script>
</head>
<body>
<div id="mapDiv"></div>
</body>
</html>
Cynthia,
You’ll need to replace graphicLayer with a graphic layer or feature layer. Right now graphicLayer is not defined. Typically I’d do something like:
var featureLayer = new FeatureLayer(url, );
map.addLayer(featureLayer);
map.on(‘load’, function(){
featureLayer.enableMouseEvents();
featureLayer.on(‘mouse-over’, function(){
map.setMapCursor(‘pointer’);
});
});
I’m not sure how best to get that featureLayer object from an AGOL webmap – maybe try:
var layers = map. getLayersVisibleAtScale();
console.log(layers);
then check out the layers object in the developer console and find the layer ID. The assign var featureLayer = map.getLayer(id);
Good Luck,
Brandon
Thanks for the help Brandon.
I'll let you know if I can get it to work.
Cynthia
Ok I'm giving it a try I don't understand this part:
var layers = map. getLayersVisibleAtScale();
console.log(layers);
then check out the layers object in the developer console and find the layer ID. The assign var featureLayer = map.getLayer(id);
How do I check the layers object in the developer console to get the layer ID? Is this there a link you have?
The developer console is a feature that’s pretty standard in most browsers these days. In Google Chrome press CrtlShiftI or in Mozilla Firefox press CrtlShiftk
Then find the web console and you’ll be able to investigate the layers object. Console.log or alert() are really effective debugging tools.
I believe this is for Derek.
>>> Brandon Flessner <geonet@esri.com> 11/19/2015 1:15 PM >>>
Brandon Flessner
replied to the discussion
"Change mouse pointer onMouseOver of graphic/feature"
To view the discussion, visit:
https://community.esri.com/message/569545?et=watches.email.thread#569545