calipho-sib / sequence-viewer

neXtProt protein sequence viewer (javascript) - From SIB CALIPHO group; neXtProt project
https://cdn.rawgit.com/calipho-sib/sequence-viewer/master/examples/index.html
50 stars 18 forks source link

Coverage render bug #2

Closed bpollakw closed 8 years ago

bpollakw commented 8 years ago

Hi, I was attempting to use the coverage example on large sequences (>1100aa or bp) and after a certain threshold the sequences start having weird rendering bugs... Can you try this out?

I'm copying the JS I ran in codepen that should replicate the error:

// Classic display of the sequence

var Sequence = require("sequence-viewer"); var seq1 = new Sequence('MALWMRLLPLLALLALWGPDPAAAFVNQHLCGSHLVEALYLVCGERGFFYTPKTRREAEDLQVGQVELGGGPGAGSLQPLALEGSLQKRGIVEQCCTSICSLYQLENYCNMALWMRLLPLLALLALWGPDPAAAFVNQHLCGSHLVEALYLVCGERGFFYTPKTRREAEDLQVGQVELGGGPGAGSLQPLALEGSLQKRGIVEQCCTSICSLYQLENYCNMALWMRLLPLLALLALWGPDPAAAFVNQHLCGSHLVEALYLVCGERGFFYTPKTRREAEDLQVGQVELGGGPGAGSLQPLALEGSLQKRGIVEQCCTSICSLYQLENYCNMALWMRLLPLLALLALWGPDPAAAFVNQHLCGSHLVEALYLVCGERGFFYTPKTRREAEDLQVGQVELGGGPGAGSLQPLALEGSLQKRGIVEQCCTSICSLYQLENYCNMALWMRLLPLLALLALWGPDPAAAFVNQHLCGSHLVEALYLVCGERGFFYTPKTRREAEDLQVGQVELGGGPGAGSLQPLALEGSLQKRGIVEQCCTSICSLYQLENYCNMALWMRLLPLLALLALWGPDPAAAFVNQHLCGSHLVEALYLVCGERGFFYTPKTRREAEDLQVGQVELGGGPGAGSLQPLALEGSLQKRGIVEQCCTSICSLYQLENYCNMALWMRLLPLLALLALWGPDPAAAFVNQHLCGSHLVEALYLVCGERGFFYTPKTRREAEDLQVGQVELGGGPGAGSLQPLALEGSLQKRGIVEQCCTSICSLYQLENYCNMALWMRLLPLLALLALWGPDPAAAFVNQHLCGSHLVEALYLVCGERGFFYTPKTRREAEDLQVGQVELGGGPGAGSLQPLALEGSLQKRGIVEQCCTSICSLYQLENYCNMALWMRLLPLLALLALWGPDPAAAFVNQHLCGSHLVEALYLVCGERGFFYTPKTRREAEDLQVGQVELGGGPGAGSLQPLALEGSLQKRGIVEQCCTSICSLYQLENYCNMALWMRLLPLLALLALWGPDPAAAFVNQHLCGSHLVEALYLVCGERGFFYTPKTRREAEDLQVGQVELGGGPGAGSLQPLVCGERGFFYTPKTRREAEDLQVGQVELGGGPGAGSLQPLALEGSLQKRGI'); // You can add some rendering options seq1.render('#seqView1', { 'showLineNumbers': true, 'wrapAminoAcids': true, 'charsPerLine': 100, 'toolbar': true, 'search': true}); seq1.onMouseSelection(function(elem){ console.log(elem.detail); } ); seq1.onSubpartSelected(function(elem){ console.log(elem.detail); } ); seq1.onAll(function(name,data){ console.log(arguments); });

        //Coverage list
    var exempleSequenceCoverage = [
        {start: 0, end: 25, color: "black", underscore: false},
        {start: 25, end: 47, color: "#ff0000", underscore: false},
        {start: 47, end: 54, color: "#ff0000", underscore: true}
    ];
    seq1.coverage(exempleSequenceCoverage);
    // for coverage + highlight :
    // seq.coverage(exempleSequenceCoverage, start, end, highlightColor);

    //Define Legend and color codes
    var exempleLegend = [
        {name: "Mature Protein", color: "#ff0000", underscore: false},
        {name: "Proteotypic peptide", color: "#69CC33", underscore: false},
        {name: "Synthetic peptide",color: "#fff",underscore: true}
        ];
    seq1.addLegend(exempleLegend);

MatSchaeff commented 8 years ago

Hello bpollakw,

Yes this is because when using the coverage method, you need to fulfill the coverage list for each position. If you let even a single position not covered, it might break the rendering. I do understand that this can be annoying when handling large sequence.

For now, you only have two options : a single selection or the full coverage of the sequence. But I will try to fix that by automatically filling the gap in the coverage method, as soon as possible.

Thank you for your remark, as it could be useful for others.

Cheers,

Mathieu

MatSchaeff commented 8 years ago

Hi bpollakw,

This issue is fixed. Your code should work now ;) ( http://plnkr.co/edit/jjocWNq2JNELFHNdvpZi?p=preview )

Best regards,

Mathieu

bpollakw commented 8 years ago

Hey Mathiew!

I’ll try it out! Thanks for all the help!

Best, Bernardo

On Nov 30, 2015, at 0:44, Mathieu Schaeffer notifications@github.com wrote:

Hi bpollakw,

This issue is fixed. Your code should work now ;) ( http://plnkr.co/edit/jjocWNq2JNELFHNdvpZi?p=preview )

Best regards,

Mathieu

— Reply to this email directly or view it on GitHub.