IGV.js Example - Events

Use IGV's events to extend default behavior and improve integration with other parts of your app.

Event Description Examples
locuschange

Fired whenever the viewer locus changes.


Note: as of release 2.10.0 an array of reference frames is passed to the handler to account for multi-locus views. Arguments Passed to Handler Fn:
referenceFrameList
[{chr, start, end, label}, {chr, start, end, label}, ...]
Track locus in page URL
trackclick

Fired whenever the user clicks on a track feature - use this event to customize popover behavior/appearance.

  • The handler function can return a string to override the default popover contents.
  • If the handler function returns false the default popup will not be shown.
  • If the handler function returns undefined then the default popup will be shown.


Arguments Passed to Handler Fn:
track
{object} trackView track object
popupData
{object[]} data that would normally be shown in popup
Custom Track Popover
Popover Track Click Handling
trackdrag

Fired whenever the user drags one of the tracks

trackremoved

Fired whenever a track is removed from the viewer


Arguments Passed to Handler Fn:
track
{object} removed track
Track Reorder
trackorderchanged

Fired whenever the track order is changed, either by (1) dragging, (2) adding a new track, or (3) removing a track


Arguments Passed to Handler Fn:
trackNames
{Array} ordered list of track names
on(<event name>, <handler fn>, [this])
    var div = $("#igvDiv")[0],
        options = {
            ...
        };

    var browser = igv.createBrowser(div, options);

    var onLocusChange = function (referenceFrame) {
        alert("Locus changed to: " + referenceFrame.label);
    };

    browser.on("locuschange", onLocusChange);
            
un(<event name>, <handler fn>)
    browser.un("locuschange", onLocusChange);