Cell Mouseover Box Actions

When a user clicks the mouse on a cell, a menu will appear from the mouseover box. This menu contains actions the end-user can make from the cell, including dynamic links and special Flaremap actions like tracking and zooming.

Cell actions are located in the following div tag of the HTML.

#mouseOverContainer .cellMouseOver .moMenuContainer .moMenu .moMenuItem a

All actions are formatted as hyperlinks. Standard HTML markup for the <a> tag may be used. To insert the value of an attribute from the cell in a link, enclose the attribute name in curly braces '{}'.

Cell Tracking

To add Cell Tracking to a cell mouseover box action menu include the following code. Once added, the Cell Tracking action item will automatically change between “Track this cell” and “Untrack this cell” depending upon the state of the current cell.

<div class="moMenuItem"><a href="javascript:MouseOverActions.trackCell(-1);"><span id="spanTrackOrUntrack">Track</span> this cell</a></div>

Group Tracking

To add Group Tracking to a cell mouseover box action menu include the following code. Both items below must be included for group tracking to work properly.

<div class="moMenuItem"><a href="javascript:MouseOverActions.trackParentGroup(1);">Track visible cells in this group</a></div>
<div class="moMenuItem"><a href="javascript:MouseOverActions.trackParentGroup(0);">Untrack visible cells in this group</a></div>

Cell Zooming

To add zooming to a cell mouseover box action menu include the following code. Both items below must be included for group tracking to work properly. Note: The “Zoom Out” option will only appear when the treemap is “zoomed in”.

<div class="moMenuItem"><a href="javascript:MouseOverActions.zoomToGroup();">Zoom in</a></div>
<div class="moMenuItem zoomOutAction" style="display:none;"><a href="javascript:MouseOverActions.zoomOut();">Zoom out</a></div>

Example

Sample cell mouseover box action menu:

<div id="mouseOverContainer">
...
<div class="moMenu">

</div>
...
</div>