Interaction

The interaction control adds quite a bit of logic to the map, adding interactivity – mouse hovers and clicks – to layers that support it, like those made with TileMill and the interactive UTFGrid section of the MBTiles spec.

The interaction control takes a parameter, callbacks, that has the default value of new wax.tooltip() – the default tooltip library that comes with wax. Any other library that implements the same interface (see tooltips.js) can be passed into the callbacks parameter.

Example

<div id='map-div'></div>
<script>
var mm = com.modestmaps;
wax.tilejson(
  'http://tiles.mapbox.com/mapbox/api/Tileset/geography-class',
  function(tilejson) {
    var m = new mm.Map('map-div',
      new wax.mm.connector(tilejson));

    wax.mm.interaction(m, tilejson);
    m.setCenterZoom(new mm.Location(39, -98), 1);
  }
);
</script>

API

var interaction = wax.mm.interaction(map, tilejson, options)
Create a new interaction object with a given map, TileJSON, and options object. Interaction takes an options argument:
callbacks: wax.tooltip or equivalent
By default, this control triggers tooltips for when the user hovers over things and clicks them. You can spot in any other object that implements all of the functions that wax.tooltip does.
clickAction: ['full', 'teaser', 'location']
When a user clicks an element, a number of different things can happen. By default, this control tries the 'full' formatter, and then the 'location' formatter, and, according to what they do, either opens a tooltip with the 'full' content, or goes to the location specified by the 'location' content. You can specify your own list - an array of strings is necessary - of things that will happen instead.
clickHandler: function(url) {}
By default, this control will simply set window.location when the 'location' formatter is used. In some cases, like when you're using Backbone or another Javascript framework, you might want a different Javascript link-follower, or do things like redirecting users to a 'leaving this site' page. You can provide one with a clickHandler function.
interaction.remove()
Disengage an interaction object from the map it is bound to: this removes all of its event listeners and hides any tooltips, if any are being shown.
blog comments powered by Disqus