I have implemented the Feature Layer Hover sample in my map. I've added in a max scale to control when the tooltips are shown. I'd also like to be able to hide the tooltips after a certain period of time so they do not continue to block the user's view. I've tried a few different options, without success. I reworked my code a bit to try the solution I found here, but I didn't have much luck. I wasn't sure whether it was best to use a hide or setTimeout, or maybe even an if/else statement. Any suggestions appreciated.
My code as it currently stands:
tooltips.setRenderer(new SimpleRenderer(tooltipFill));
dialog = new TooltipDialog({
id: "tooltipDialog"
//style: "position: absolute; font: normal normal normal 10pt Helvetica;z-index:100"
});
dialog.startup();
mapMain.on("load", function (){
mapMain.graphics.enableMouseEvents();
mapMain.graphics.on("mouse-out", closeDialog);
});
tooltips.on("mouse-over", function (evt){
var parksTooltips = "${NAME}";
var content = esriLang.substitute(evt.graphic.attributes, parksTooltips);
var highlightGraphic = new Graphic(evt.graphic.geometry, tooltipFill);
mapMain.graphics.add(highlightGraphic);
dialog.setContent(content);
domStyle.set(dialog.domNode, "opacity", 0.85);
dijitPopup.open({
popup: dialog,
x: evt.pageX,
y: evt.pageY
});
});
function closeDialog() {
mapMain.graphics.clear();
dijitPopup.close(dialog);
}
Ashley,
Here is what I use in my Identify widget to auto close the maps infowindow:
this.graphicsLayer.on('mouse-over', lang.hitch(this, this.mouseOverGraphic));
this.graphicsLayer.on('mouse-out', lang.hitch(this, this.mouseOutGraphic));
//mouse over graphic
mouseOverGraphic: function(event) {
this.disableTimer();
//do something here to show your tooltip
},
mouseOutGraphic: function (event) {
this.timedClose();
},
timedClose: function(){
clearTimeout(this.timer);
this.timer = setTimeout(
lang.hitch(this, function(){
//hide your tooltip
}
),2000);
},
disableTimer: function(){
clearTimeout(this.timer);
},
//I am using mapinfowindow so I attach mouseover and mouseout to the infowindow
this.infoWinMouseOver = on(this.map.infoWindow.domNode, 'mouseover', lang.hitch(this, function(){
this.disableTimer();
}));
this.infoWinMouseOut = on(this.map.infoWindow.domNode, 'mouseout', lang.hitch(this, function() {
this.timedClose();
}));
Thanks Robert! I'll see if I can get that implemented.