Coverage Track

expose_all <- function (package) {
    attachname <- paste0(package, "_all")
    while (attachname %in% search()) detach(attachname, character.only = TRUE)
    pkgns <- loadNamespace(package)
    attach(pkgns, name = attachname)
    invisible(pkgns)
}
suppressMessages(expose_all("TnT"))

Coverage Feature

https://github.com/tntvis/tnt.board/blob/master/examples/dynamic_ranges/ranges.js

trackWidget('
var data = [
    {start:1,end:10,height:0.840188},
    {start:11,end:20,height:0.394383},
    {start:21,end:30,height:0.783099},
    {start:31,end:40,height:0.79844},
    {start:41,end:50,height:0.911647},
    {start:51,end:60,height:0.197551},
    {start:61,end:70,height:0.335223},
    {start:71,end:80,height:0.76823},
    {start:81,end:90,height:0.277775},
    {start:91,end:100,height:0.55397},
    {start:101,end:110,height:0.477397},
    {start:111,end:120,height:0.628871},
    {start:121,end:130,height:0.364784},
    {start:131,end:140,height:0.513401},
    {start:141,end:150,height:0.95223},
    {start:151,end:160,height:0.916195},
    {start:161,end:170,height:0.635712},
    {start:171,end:180,height:0.717297},
    {start:181,end:190,height:0.141603},
    {start:191,end:200,height:0.606969},
    {start:201,end:210,height:0.0163006},
    {start:211,end:220,height:0.242887},
    {start:221,end:230,height:0.137232},
    {start:231,end:240,height:0.804177},
    {start:241,end:250,height:0.156679},
    {start:251,end:260,height:0.400944},
    {start:261,end:270,height:0.12979},
    {start:271,end:280,height:0.108809},
    {start:281,end:290,height:0.998925},
    {start:291,end:300,height:0.218257},
    {start:301,end:310,height:0.512932},
    {start:311,end:320,height:0.839112},
    {start:321,end:330,height:0.61264},
    {start:331,end:340,height:0.296032},
    {start:341,end:350,height:0.637552},
    {start:351,end:360,height:0.524287},
    {start:361,end:370,height:0.493583},
    {start:371,end:380,height:0.972775},
    {start:381,end:390,height:0.292517},
    {start:391,end:400,height:0.771358},
    {start:401,end:410,height:0.526745},
    {start:411,end:420,height:0.769914},
    {start:421,end:430,height:0.400229},
    {start:431,end:440,height:0.891529},
    {start:441,end:450,height:0.283315},
    {start:451,end:460,height:0.352458},
    {start:461,end:470,height:0.807725},
    {start:471,end:480,height:0.919026},
    {start:481,end:490,height:0.0697553},
    {start:491,end:500,height:0.949327},
    {start:501,end:510,height:0.525995},
    {start:511,end:520,height:0.0860558},
    {start:521,end:530,height:0.192214},
    {start:531,end:540,height:0.663227},
    {start:541,end:550,height:0.890233},
    {start:551,end:560,height:0.348893},
    {start:561,end:570,height:0.0641713},
    {start:571,end:580,height:0.020023},
    {start:581,end:590,height:0.457702},
    {start:591,end:600,height:0.0630958},
    {start:601,end:610,height:0.23828},
    {start:611,end:620,height:0.970634},
    {start:621,end:630,height:0.902208},
    {start:631,end:640,height:0.85092},
    {start:641,end:650,height:0.266666},
    {start:651,end:660,height:0.53976},
    {start:661,end:670,height:0.375207},
    {start:671,end:680,height:0.760249},
    {start:681,end:690,height:0.512535},
    {start:691,end:700,height:0.667724},
    {start:701,end:710,height:0.531606},
    {start:711,end:720,height:0.0392803},
    {start:721,end:730,height:0.437638},
    {start:731,end:740,height:0.931835},
    {start:741,end:750,height:0.93081},
    {start:751,end:760,height:0.720952},
    {start:761,end:770,height:0.284293},
    {start:771,end:780,height:0.738534},
    {start:781,end:790,height:0.639979},
    {start:791,end:800,height:0.354049},
    {start:801,end:810,height:0.687861},
    {start:811,end:820,height:0.165974},
    {start:821,end:830,height:0.440105},
    {start:831,end:840,height:0.880075},
    {start:841,end:850,height:0.829201},
    {start:851,end:860,height:0.330337},
    {start:861,end:870,height:0.228968},
    {start:871,end:880,height:0.893372},
    {start:881,end:890,height:0.35036},
    {start:891,end:900,height:0.68667},
    {start:901,end:910,height:0.956468},
    {start:911,end:920,height:0.58864},
    {start:921,end:930,height:0.657304},
    {start:931,end:940,height:0.858676},
    {start:941,end:950,height:0.43956},
    {start:951,end:960,height:0.92397},
    {start:961,end:970,height:0.398437},
    {start:971,end:980,height:0.814767},
    {start:981,end:990,height:0.684219},
    {start:991,end:1000,height:0.910972}
];


// The coverage custom feature
var coverageFeature = tnt.board.track.feature()
    .index(function(d) {
        return d.start + "-" + d.end;
    });

var coverageFeatureInverse = tnt.board.track.feature()
    .index(function(d) {
        return d.start + "-" + d.end;
    });


// Create new elements
coverageFeature.create(function (el) {
    var xScale = coverageFeature.scale();
    var track = this;
    var y = track.height();

    var barScale = d3.scale.linear()
        .domain([0, 1])
        .range([0, y]);
    var colorScale = d3.scale.linear()
        .domain([0, 1])
        .range(["#5ba633", "#027be3"]);

    var g = el
        .append("g");

    g.append("rect")
        .attr("x", function (d) {
            return xScale(d.start);
        })
        .attr("y", function (d) {
            return y - barScale(d.height);
            //return 0;
        })
        .attr("width", function (d) {
            return xScale(d.end) - xScale(d.start);
        })
        .attr("height", function (d) {
            return barScale(d.height);
        })
        .style("fill", function (d) {
            return colorScale(d.height);
        })
});

coverageFeatureInverse.create(function (el) {
    var xScale = coverageFeature.scale();
    var track = this;
    var y = track.height();

    var barScale = d3.scale.linear()
        .domain([0, 1])
        .range([0, y]);
    var colorScale = d3.scale.linear()
        .domain([0, 1])
        .range(["#5ba633", "#027be3"]);

    var g = el
        .append("g");

    g.append("rect")
        .attr("x", function (d) {
            return xScale(d.start);
        })
        .attr("y", function (d) {
            //return y - barScale(d.height);
            return 0;
        })
        .attr("width", function (d) {
            return xScale(d.end) - xScale(d.start);
        })
        .attr("height", function (d) {
            return barScale(d.height);
        })
        .style("fill", function (d) {
            return colorScale(d.height);
        })
});

coverageFeature.move(function (el) {
    var xScale = coverageFeature.scale();

    el.select("g")
        .select("rect")
        .attr("x", function (d) {
            return xScale(d.start);
        })
        .attr("width", function (d) {
            return xScale(d.end) - xScale(d.start);
        })
});

coverageFeatureInverse.move(function (el) {
    var xScale = coverageFeature.scale();

    el.select("g")
        .select("rect")
        .attr("x", function (d) {
            return xScale(d.start);
        })
        .attr("width", function (d) {
            return xScale(d.end) - xScale(d.start);
        })
});

// The board
var myBoard = tnt.board().from(20).to(500).max(1000);

// The location track
var location_track = tnt.board.track()
    .height(20)
    .color("white")
    .display(tnt.board.track.feature.axis()
        .orientation("top")
    );

// The ranges track
var ranges_track = tnt.board.track()
    .label("coverage plot")
    .height(80)
    .color("white")
    .data (tnt.board.track.data.sync()
        .retriever (function (loc) {
            // Return only the range on display
            var rangeData = data.filter(function (d) {
                return (d.start > loc.from) && (d.end < loc.to);
            });
            // if necessary group or edit the number of elements to show
            // rangeData = getNewRange(data, loc)
            return rangeData;
        })
    )
    .display(coverageFeature);

var ranges_track2 = tnt.board.track()
    .label("coverage plot")
    .height(80)
    .color("white")
    .data (tnt.board.track.data.sync()
        .retriever (function (loc) {
            // Return only the range on display
            var rangeData = data.filter(function (d) {
                return (d.start > loc.from) && (d.end < loc.to);
            });
            // if necessary group or edit the number of elements to show
            // rangeData = getNewRange(data, loc)
            return rangeData;
        })
    )
    .display(coverageFeatureInverse);

// Add the tracks and start
myBoard
    .add_track(location_track)
    .add_track(ranges_track2)
    .add_track(ranges_track);

myBoard

//myBoard(document.getElementById("mydiv"));
//myBoard.start();

')



2

trackWidget('
var data = [{start: 1, end: 1, height: 0.840188},
    {start: 2, end: 2, height: 0.394383},
    {start: 3, end: 3, height: 0.783099},
    {start: 4, end: 4, height: 0.79844},
    {start: 5, end: 5, height: 0.911647},
    {start: 6, end: 6, height: 0.197551},
    {start: 7, end: 7, height: 0.335223},
    {start: 8, end: 8, height: 0.76823},
    {start: 9, end: 9, height: 0.277775},
    {start: 10, end: 10, height: 0.55397},
    {start: 11, end: 11, height: 0.477397},
    {start: 12, end: 12, height: 0.628871},
    {start: 13, end: 13, height: 0.364784},
    {start: 14, end: 14, height: 0.513401},
    {start: 15, end: 15, height: 0.95223},
    {start: 16, end: 16, height: 0.916195},
    {start: 17, end: 17, height: 0.635712},
    {start: 18, end: 18, height: 0.717297},
    {start: 19, end: 19, height: 0.141603},
    {start: 20, end: 20, height: 0.606969},
    {start: 21, end: 21, height: 0.0163006},
    {start: 22, end: 22, height: 0.242887},
    {start: 23, end: 23, height: 0.137232},
    {start: 24, end: 24, height: 0.804177},
    {start: 25, end: 25, height: 0.156679},
    {start: 26, end: 26, height: 0.400944},
    {start: 27, end: 27, height: 0.12979},
    {start: 28, end: 28, height: 0.108809},
    {start: 29, end: 29, height: 0.998925},
    {start: 30, end: 30, height: 0.218257},
    {start: 31, end: 31, height: 0.512932},
    {start: 32, end: 32, height: 0.839112},
    {start: 33, end: 33, height: 0.61264},
    {start: 34, end: 34, height: 0.296032},
    {start: 35, end: 35, height: 0.637552},
    {start: 36, end: 36, height: 0.524287},
    {start: 37, end: 37, height: 0.493583},
    {start: 38, end: 38, height: 0.972775},
    {start: 39, end: 39, height: 0.292517},
    {start: 40, end: 40, height: 0.771358},
    {start: 41, end: 41, height: 0.526745},
    {start: 42, end: 42, height: 0.769914},
    {start: 43, end: 43, height: 0.400229},
    {start: 44, end: 44, height: 0.891529},
    {start: 45, end: 45, height: 0.283315},
    {start: 46, end: 46, height: 0.352458},
    {start: 47, end: 47, height: 0.807725},
    {start: 48, end: 48, height: 0.919026},
    {start: 49, end: 49, height: 0.0697553},
    {start: 50, end: 50, height: 0.949327},
    {start: 51, end: 51, height: 0.525995},
    {start: 52, end: 52, height: 0.0860558},
    {start: 53, end: 53, height: 0.192214},
    {start: 54, end: 54, height: 0.663227},
    {start: 55, end: 55, height: 0.890233},
    {start: 56, end: 56, height: 0.348893},
    {start: 57, end: 57, height: 0.0641713},
    {start: 58, end: 58, height: 0.020023},
    {start: 59, end: 59, height: 0.457702},
    {start: 60, end: 60, height: 0.0630958},
    {start: 61, end: 61, height: 0.23828},
    {start: 62, end: 62, height: 0.970634},
    {start: 63, end: 63, height: 0.902208},
    {start: 64, end: 64, height: 0.85092},
    {start: 65, end: 65, height: 0.266666},
    {start: 66, end: 66, height: 0.53976},
    {start: 67, end: 67, height: 0.375207},
    {start: 68, end: 68, height: 0.760249},
    {start: 69, end: 69, height: 0.512535},
    {start: 70, end: 70, height: 0.667724},
    {start: 71, end: 71, height: 0.531606},
    {start: 72, end: 72, height: 0.0392803},
    {start: 73, end: 73, height: 0.437638},
    {start: 74, end: 74, height: 0.931835},
    {start: 75, end: 75, height: 0.93081},
    {start: 76, end: 76, height: 0.720952},
    {start: 77, end: 77, height: 0.284293},
    {start: 78, end: 78, height: 0.738534},
    {start: 79, end: 79, height: 0.639979},
    {start: 80, end: 80, height: 0.354049},
    {start: 81, end: 81, height: 0.687861},
    {start: 82, end: 82, height: 0.165974},
    {start: 83, end: 83, height: 0.440105},
    {start: 84, end: 84, height: 0.880075},
    {start: 85, end: 85, height: 0.829201},
    {start: 86, end: 86, height: 0.330337},
    {start: 87, end: 87, height: 0.228968},
    {start: 88, end: 88, height: 0.893372},
    {start: 89, end: 89, height: 0.35036},
    {start: 90, end: 90, height: 0.68667},
    {start: 91, end: 91, height: 0.956468},
    {start: 92, end: 92, height: 0.58864},
    {start: 93, end: 93, height: 0.657304},
    {start: 94, end: 94, height: 0.858676},
    {start: 95, end: 95, height: 0.43956},
    {start: 96, end: 96, height: 0.92397},
    {start: 97, end: 97, height: 0.398437},
    {start: 98, end: 98, height: 0.814767},
    {start: 99, end: 99, height: 0.684219},
    {start: 901, end: 901, height: 0.31299},
    {start: 902, end: 902, height: 0.105576},
    {start: 903, end: 903, height: 0.888433},
    {start: 904, end: 904, height: 0.102233},
    {start: 905, end: 905, height: 0.479777},
    {start: 906, end: 906, height: 0.270321},
    {start: 907, end: 907, height: 0.199724},
    {start: 908, end: 908, height: 0.287736},
    {start: 909, end: 909, height: 0.657643},
    {start: 910, end: 910, height: 0.947001},
    {start: 911, end: 911, height: 0.221918},
    {start: 912, end: 912, height: 0.506915},
    {start: 913, end: 913, height: 0.778463},
    {start: 914, end: 914, height: 0.936349},
    {start: 915, end: 915, height: 0.142119},
    {start: 916, end: 916, height: 0.294601},
    {start: 917, end: 917, height: 0.561007},
    {start: 918, end: 918, height: 0.64452},
    {start: 919, end: 919, height: 0.873414},
    {start: 920, end: 920, height: 0.232848},
    {start: 921, end: 921, height: 0.673996},
    {start: 922, end: 922, height: 0.629359},
    {start: 923, end: 923, height: 0.832555},
    {start: 924, end: 924, height: 0.812997},
    {start: 925, end: 925, height: 0.773301},
    {start: 926, end: 926, height: 0.0284525},
    {start: 927, end: 927, height: 0.590407},
    {start: 928, end: 928, height: 0.617582},
    {start: 929, end: 929, height: 0.763764},
    {start: 930, end: 930, height: 0.774432},
    {start: 931, end: 931, height: 0.284289},
    {start: 932, end: 932, height: 0.0767534},
    {start: 933, end: 933, height: 0.880009},
    {start: 934, end: 934, height: 0.172722},
    {start: 935, end: 935, height: 0.178987},
    {start: 936, end: 936, height: 0.359786},
    {start: 937, end: 937, height: 0.443043},
    {start: 938, end: 938, height: 0.37871},
    {start: 939, end: 939, height: 0.647522},
    {start: 940, end: 940, height: 0.100686},
    {start: 941, end: 941, height: 0.325711},
    {start: 942, end: 942, height: 0.86944},
    {start: 943, end: 943, height: 0.6076},
    {start: 944, end: 944, height: 0.104174},
    {start: 945, end: 945, height: 0.805789},
    {start: 946, end: 946, height: 0.749719},
    {start: 947, end: 947, height: 0.398775},
    {start: 948, end: 948, height: 0.366796},
    {start: 949, end: 949, height: 0.394239},
    {start: 950, end: 950, height: 0.272189},
    {start: 951, end: 951, height: 0.599644},
    {start: 952, end: 952, height: 0.0682348},
    {start: 953, end: 953, height: 0.901549},
    {start: 954, end: 954, height: 0.432199},
    {start: 955, end: 955, height: 0.881232},
    {start: 956, end: 956, height: 0.67485},
    {start: 957, end: 957, height: 0.460652},
    {start: 958, end: 958, height: 0.471639},
    {start: 959, end: 959, height: 0.292432},
    {start: 960, end: 960, height: 0.224415},
    {start: 961, end: 961, height: 0.246071},
    {start: 962, end: 962, height: 0.576721},
    {start: 963, end: 963, height: 0.301169},
    {start: 964, end: 964, height: 0.12608},
    {start: 965, end: 965, height: 0.749443},
    {start: 966, end: 966, height: 0.480156},
    {start: 967, end: 967, height: 0.485866},
    {start: 968, end: 968, height: 0.192486},
    {start: 969, end: 969, height: 0.858866},
    {start: 970, end: 970, height: 0.133388},
    {start: 971, end: 971, height: 0.293171},
    {start: 972, end: 972, height: 0.184577},
    {start: 973, end: 973, height: 0.00282779},
    {start: 974, end: 974, height: 0.900772},
    {start: 975, end: 975, height: 0.288752},
    {start: 976, end: 976, height: 0.808617},
    {start: 977, end: 977, height: 0.650491},
    {start: 978, end: 978, height: 0.687527},
    {start: 979, end: 979, height: 0.175413},
    {start: 980, end: 980, height: 0.0447295},
    {start: 981, end: 981, height: 0.959716},
    {start: 982, end: 982, height: 0.775058},
    {start: 983, end: 983, height: 0.112964},
    {start: 984, end: 984, height: 0.861265},
    {start: 985, end: 985, height: 0.207257},
    {start: 986, end: 986, height: 0.994196},
    {start: 987, end: 987, height: 0.536115},
    {start: 988, end: 988, height: 0.667908},
    {start: 989, end: 989, height: 0.465835},
    {start: 990, end: 990, height: 0.828546},
    {start: 991, end: 991, height: 0.892324},
    {start: 992, end: 992, height: 0.711906},
    {start: 993, end: 993, height: 0.405267},
    {start: 994, end: 994, height: 0.193493},
    {start: 995, end: 995, height: 0.837986},
    {start: 996, end: 996, height: 0.154711},
    {start: 997, end: 997, height: 0.673648},
    {start: 998, end: 998, height: 0.323852},
    {start: 999, end: 999, height: 0.347196},
    {start: 1000, end: 1000, height: 0.532514}
];

// The coverage custom feature
var coverageFeature = tnt.board.track.feature()
    .index(function(d) {
        return d.start + "-" + d.end;
    });

// Create new elements
coverageFeature.create(function (el) {
    var xScale = coverageFeature.scale();
    var track = this;
    var y = track.height();

    var barScale = d3.scale.linear()
        .domain([0, 1])
        .range([0, y]);
    var colorScale = d3.scale.linear()
        .domain([0, 1])
        .range(["#5ba633", "#027be3"]);

    var g = el
        .append("g");

    g.append("rect")
        .attr("x", function (d) {
            return xScale(d.start);
        })
        .attr("y", function (d) {
            return y - barScale(d.height);
        })
        .attr("width", function (d) {
            return xScale(d.end) - xScale(d.start);
        })
        .attr("height", function (d) {
            return barScale(d.height);
        })
        .style("fill", function (d) {
            return colorScale(d.height);
        })
});

coverageFeature.move(function (el) {
    var xScale = coverageFeature.scale();

    el.select("g")
        .select("rect")
        .attr("x", function (d) {
            return xScale(d.start);
        })
        .attr("width", function (d) {
            return xScale(d.end) - xScale(d.start);
        })
});

function getHeightInStep(arr) {
    // mean of the data in the subarray passed as argument
    return d3.sum(arr, function (d) {
        return d.height;
    }) / arr.length;
}

function getRangedData(data, to, from, steps) {
    var stepLength = (to - from) / steps;
    var slice = [];
    for (var i = from; i < to; i += stepLength) {
        slice.push({
            start: i,
            end: (i + stepLength),
            height: getHeightInStep(data.slice(i, (i + stepLength)))
        });
    }
    return slice;
}

// The board
var myBoard = tnt.board()
    .from(0)
    .to(1000)
    .max(1000)
    .zoom_in(50)
    .zoom_out(1000);

// The location track
var location_track = tnt.board.track()
    .height(20)
    .color("white")
    .display(tnt.board.track.feature.axis()
        .orientation("top")
    );

// The ranges track
var ranges_track = tnt.board.track()
    .label("coverage plot")
    .height(80)
    .color("white")
    .data (tnt.board.track.data.sync()
        .retriever (function (loc) {
            // Return only the range on display
            // Keep a constant same number of steps (bars) on view
            return getRangedData(data, loc.to, loc.from, 50);
        })
    )
    .display(coverageFeature);

// Add the tracks and start
myBoard
    .add_track(location_track)
    .add_track(ranges_track);

myBoard;
')



Session Info

sessionInfo()


Try the TnT package in your browser

Any scripts or data that you put into this service are public.

TnT documentation built on Nov. 8, 2020, 8:11 p.m.