This may be a very simple question, I only started using the system today. I have setup a map, I have setup a marker. I have that all running on my test system, not problem. I can’t find any reference in the API to being able to apply a mouseover, or label string to a marker applied to a map though. I’m sure I must be missing something really simple, but it’s not leaping out.
Where should I be looking? Ideally it would be a mouseover, or static label on the map, with a click to URL function.
You can use the popup - https://developer.tomtom.com/maps-sdk-web-js/documentation#Maps.Popup
You can put the HTML code with the link in setHTML() method or create an HTML element and use it in setDOMContent() method.
This is largely what I was after but I’m still struggling to get the HTML to work. I have:
var div = window.document.createElement('div');
div.innerHTML = 'Hello, world!';
var m1 =tomtom.L.marker([56.00190, -3.78390], markerOptions)
var m2 =tomtom.L.marker([56.10190, -3.98390], markerOptions)
.setContent("<center><b>Place Name</b> <br> <i>("+ e.latlng.toString()+")</i></center>")
The above contains two markers, m1 and m2. The m2 works nicely, but note the popup refers to setContent which is not listed inthe API ( https://developer.tomtom.com/maps-sdk-web-js/documentation#Maps.Popup ) as a valid method/property. If I use SetDOMContent, or setHTML I get an error. It’s as if the popup class has a different interface. I note the string used by the set content does accept HTML, but got most upset when I tried to enter a URL even when the slashes were escape charactered.
What did I miss?
You are mixing versions of the SDK. The code above refers to version 4, and the documentation refers to v5.
Here’s the documentation for version 4: https://developer.tomtom.com/maps-sdk-web/documentation
We recommend to use the newest version!
Thankyou, unintentional… Not sure how that happened actually. I downloaded the packages only this week. I’ll look to migrate to v5. Most frustrating!
Feel free to continuing using v4 if you are happy with it, but we won’t be adding new features to it as currently v5 is our main focus.
v5 has advantages compared to v4!
- Better performance
- smaller and more modular (e.g the services library can be imported separately and can be used in node)
- easier to use (we also improved the documentation)
- Available via CDN (you don’t need to host the library yourself)
- Available in npm (you can import it as you do with other npm modules)
Something like this:
The CGI version isn’t currently working on V4, there is a server 500 error that I’ve not been able to track down yet. I only started this earlier in the week, gimme chance…