AnsweredAssumed Answered

Customise cursor tooltip

Question asked by bundarrabandito on Feb 20, 2012
Latest reply on Sep 27, 2018 by kmsagis

Like • Show 1 Like1
Comment • 15

Hi all,

The Esri draw toolbar has a neat cursor tooltip that follows the cursor about (telling the user what to do). I'd like to implement this for an add text tool. Is this something we can access in the API? Or Dojo? I couldn't find it in either.

Thanks for any suggestions.

Ed

DSwingley-esristaff

Feb 23, 2012 10:57 AM

Correct Answer

The tooltip you see when using a drawing toolbar is a div that's repositioned as the cursor moves around when a tool is active. It is not a dijit from dojo and it's nothing too special.

Here's a JS fiddle showing how to do something similar: http://jsfiddle.net/FXZwc/

See the reply in context

No one else had this question

Outcomes

15 Replies

bundarrabandito Feb 22, 2012 11:24 PM
Mark Correct
Correct Answer
No-one? Not possible?
Like • Show 0 Likes0
Actions
DSwingley-esristaff Feb 23, 2012 10:57 AM
Unmark Correct
Correct Answer
The tooltip you see when using a drawing toolbar is a div that's repositioned as the cursor moves around when a tool is active. It is not a dijit from dojo and it's nothing too special.

Here's a JS fiddle showing how to do something similar: http://jsfiddle.net/FXZwc/
3 people found this helpful
Like • Show 2 Likes2
Actions
- coreyalix01 @ DSwingley-esristaff on Nov 11, 2014 10:03 AM
  Mark Correct
  Correct Answer
  How about an enhancement? toolbar.activate(esri.toolbars.Draw.POINT, {tooltip: "my-custom-tool"});
  Like • Show 1 Like1
  Actions
bundarrabandito Feb 25, 2012 10:20 PM
Mark Correct
Correct Answer
Derek, thanks for the info and the sample, much appreciated.

Ed
Like • Show 0 Likes0
Actions
shaun_weston-eagle-co-nz-esridist Jul 25, 2013 1:41 AM
Mark Correct
Correct Answer
Is it possible to overwrite the style with your own style e.g. I use jQuery tooltips in an application, can I change the drawing toolbar to use those?
Like • Show 0 Likes0
Actions
- smcshinsky @ shaun_weston-eagle-co-nz-esridist on Jun 30, 2015 9:27 AM
  Mark Correct
  Correct Answer
  Shaun,
  
  It looks like from that sample you can change the style to match what you want. Just use the css
  
  .map .tooltip { background-color: red; border: 1px solid #7EABCD; border-radius: 4px 4px 4px 4px; font-size: 9pt; padding: 5px; position: absolute; width: 100px; z-index: 9999; }
  
  and add it to a map that has tool tips like the draw toolbar and you should get the desired effect.
  
  -Stan
  1 person found this helpful
  Like • Show 0 Likes0
  Actions
coreyalix01 Nov 11, 2014 10:33 AM
Mark Correct
Correct Answer
This should be an enhancement but if you want to avoid all that code you could replace the _setTooltipMessage method. Do the default action unless this._options.tooltip exists. Initialize the Draw tool with

drawTool = new Draw(map, {tooltip: "place text"})

Alternatively you could set

drawTool._tooltip.innerHTML = "place text"

when you activate() it.
1 person found this helpful
Like • Show 0 Likes0
Actions
MarkLache Aug 28, 2018 9:47 AM
Mark Correct
Correct Answer
I have the css and JS working for the text tooltip. Is there a way to have a symbol (i.e a "x") follow my mouse around as well?
Like • Show 0 Likes0
Actions
kmsagis Sep 24, 2018 11:27 AM
Mark Correct
Correct Answer
Mark,

I came across this thread. I want to add a custom cursor to Robert's famed eSearch. Like my site MapViewer - Savannah Area GIS has.

So what you'd do basically is set the cursor to a custom image ....

this.map.setMapCursor("url(images/cursor_parcel1.cur),auto"); // (the cursor image on my site above)

And when draw is deactivated...

this.map.setMapCursor("default");

I just need to make the tooltip move out of the way to the right but am still trying to figure out where they nestled that div away.

Today I am trying to understand how eSearch works for this. I see various things where Draw is active. I leave it active after clicking for my test site. And it's basically good, except that hitting Clear in the Graphic search tab deactivates draw but leaves the cursor image on. I am trying to figure that out. And I haven't really gotten to Identify yet either.

It's half-working, here... I still need to get it on better click handlers especially identify.
ArcGIS Web Application

Also you need to make a .cur image file. It has to be a .cur file. I used this site: Cursor Editor because you need to choose the hot spot of the cursor, i.e. where it will be "active" and click on the screen.

So, a work in progress... I'll post back when complete!
Like • Show 0 Likes0
Actions
- MarkLache @ kmsagis on Sep 25, 2018 12:22 PM
  Mark Correct
  Correct Answer
  Thanks for the info Kevin.
  
  Wow your map at MapViewer - Savannah Area GIS works very well. How do you get it to load/refresh so quickly on panning?
  Like • Show 0 Likes0
  Actions
  - kmsagis @ MarkLache on Sep 26, 2018 3:06 PM
    Mark Correct
    Correct Answer
    I host API locally. And.. it's not Web App Builder. In fact, today I am working on using 'build' with to get my new version of it faster -- ArcGIS Web Application and also trying to figure out optimal SOC pooling etc on my limited instance (this little AWS server only has 8gb / 2 core)
    Like • Show 0 Likes0
    Actions
    - MarkLache @ kmsagis on Sep 27, 2018 7:46 AM
      Mark Correct
      Correct Answer
      Right now I'm running WAB and its hosted in AGOL. Any suggestions to speed things up a bit. Maybe we can continue this conversation over email?
      Like • Show 0 Likes0
      Actions
      - kmsagis @ MarkLache on Sep 27, 2018 9:01 AM
        Mark Correct
        Correct Answer
        Sure, my email should be on my profile. I wonder if Esri runs a Build on stuff hosted on the AGOL cloud? But yes, especially since early WAB 2.x versions last year it has begun to slow down, especially on older computers.
        Like • Show 0 Likes0
        Actions
        MarkLache @ kmsagis on Sep 27, 2018 11:16 AM
        Mark Correct
        Correct Answer
        Cant find it. I followed you but still cant send a PM to you. I think you have to follow me back?
        Like • Show 0 Likes0
        Actions
        kmsagis @ MarkLache on Sep 27, 2018 12:21 PM
        Mark Correct
        Correct Answer
        Oh yea. They still have that thing with Geonet. No simple PM. Yup I will follow you, stand by to stand by...
        Like • Show 0 Likes0
        Actions

GeoNet

The Esri Community

Customise cursor tooltip

Outcomes

Related Content

Recommended Content