With Wax v6, you can use native Leaflet popups with UTFGrid interactivity:
The interaction control lets you do whatever you want with the interactivity it provides - see the documentation on tooltips and its API for the full story.
This is an example of using native Leaflet popups with
a MapBox map - when you get an on event that looks like a
click, create a Leaflet popup.
<html> <head> <script src='wax/ext/leaflet.js' type='text/javascript'></script> <script src='wax/dist/wax.leaf.js' type='text/javascript'></script> <link href='wax/ext/leaflet.css' rel='stylesheet' type='text/css' /> </head> <body> <div id='map-div'></div> </body>
wax.tilejson('https://api.tiles.mapbox.com/v3/mapbox.geography-class.jsonp',
function(tilejson) {
var map = new L.Map('map-div')
.addLayer(new wax.leaf.connector(tilejson))
.setView(new L.LatLng(51.505, -0.09), 1);
wax.leaf.interaction()
.map(map)
.tilejson(tilejson)
.on('on', function(o) {
if (o.e.type !== 'mousemove') {
// create a marker in the given location and add it to the map
var marker = new L.Marker(map.mouseEventToLatLng(o.e));
map.addLayer(marker);
// attach a given HTML content to the marker and immediately open it
marker.bindPopup(o.formatter({ format: 'teaser' }, o.data)).openPopup();
}
});
});