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.


Arguments Passed to Handler Fn:
referenceFrame
{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);