Re: [Gmod-ajax] JBrowse callback functions used for track color

SourceForge Headquarters 225 Broadway Suite 1600 San Diego, CA 92101 +1 (858) 422-6466

I still can’t get it to work properly.  Since you had mentioned that JBrowse extracts the feature at the transcript level I tagged these genes at the transcript as well as the parent gene level in the GFF3.  Also I decided to add the tag in the ‘source’ column in the GFF3 as that had worked for me in the past and perhaps easier to extract:

customColor = function(feature) {
        var src = feature.get('source');
        if (src == 'PS-DUP') {
                return 'magenta';
        } else if (src == 'Non-coding'){
                return 'red';
        }
        return 'goldenrod';
        }

However this still doesn’t work.  I tried printing to the console the value of the ‘src’ variable to see if it’s picking up something and it does at least for one of the two conditions I have (PS-DUP), so not perfect I suppose.  Maybe I’m missing some conditional code somewhere in the JBrowse source code that keep overwriting something as it seems to add red either to the main color or the ‘clip colour’ to the gene models.  That’s why I simply picked red as one of my colors to give in to this phenomenon since it seems like it’s targeting non-coding transcripts anyways.  Is this functionality any easier in JBrowse2?  I’m beginning to setup a version of JBrowse2 slowly, which is why I ask.

Coloring gene model tracks has always been a tricky thing for me, any help anyone can provide would be great.

Thanks,

Vaneet

From: Scott Cain <sc...@sc...>
Sent: September 13, 2023 5:19 PM
To: Vaneet Lotay <van...@uc...>
Cc: gmo...@li...
Subject: Re: JBrowse callback functions used for track color

[△EXTERNAL]

I am reasonably sure that syntax is right; it turns out that function is no longer used in our site, but I found a current track that has this callback:

"color" : "function(f) {var type =  f._parent.get('predictiontype'); if (type == 'tmhmm') {return 'magenta';} if (type == 'seg') {return 'lightseagreen';} if (type == 'signalp') {return 'aquamarine'} if (type == 'ncoils') {return 'chartreuse';} if (type == 'pfam') {return 'lightsalmon';} return 'purple'; }"

BUT!!!! This applies to features that only have a parent and a child; coloring genes is even more tricky. I forgot that I'd run into some difficulties with how JBrowse was representing genes (at least 6 or 7 years ago), so I ended up writing my own Gene glyph that handles coloring among other things:

https://github.com/WormBase/website-genome-browsers/tree/jbrowse-production/jbrowse/jbrowse/plugins/wormbase-glyphs

I don't think you'll need to do this though, but I can't remember how to deal with it.

Colin, help :-)

Scott

On Wed, Sep 13, 2023 at 3:30 PM Vaneet Lotay <van...@uc...<mailto:van...@uc...>> wrote:
I suppose I can just tag everything to the transcript as that seems to work.  How do you override that default behavior of JBrowse trying to estimate that a transcript is non-coding and colors it red?  Even when I can successfully change the color using my callback function, that red color remains for some transcripts where JBrowse is controlling it.  Even when I try to manually change it via 'Edit config' in a temporary session it doesn't change the red.

Thanks,

Vaneet
________________________________
From: Vaneet Lotay <van...@uc...<mailto:van...@uc...>>
Sent: September 13, 2023 3:36 PM
To: Scott Cain <sc...@sc...<mailto:sc...@sc...>>
Cc: gmo...@li...<mailto:gmo...@li...> <gmo...@li...<mailto:gmo...@li...>>
Subject: Re: [Gmod-ajax] JBrowse callback functions used for track color

[△EXTERNAL]

Hey Scott,

Is that the right syntax for calling the parent gene feature:

parentRainbowHeatMap = function(feature) {
    var score = feature._parent.get('score');
    var max = 0.01;
    var min = 2.50;
    if(score<max) {score = max;}
    if (score >min) {score = min;}
    var blueness = 190*((score-min)/(max-min));
    var hex = Math.round(blueness).toString(16);
    if (hex.length < 2) { hex = '0' + hex; }
    var color = '#' + hex + hex + 'DD';
    return color;  }

I'm asking because it results in this error from my browser console:

Uncaught TypeError: feature._parent is undefined

I tried without the period or without the underscore, still finds it undefined.

Thanks,

Vaneet
________________________________
From: Scott Cain <sc...@sc...<mailto:sc...@sc...>>
Sent: September 13, 2023 12:02 PM
To: Vaneet Lotay <van...@uc...<mailto:van...@uc...>>
Cc: gmo...@li...<mailto:gmo...@li...> <gmo...@li...<mailto:gmo...@li...>>
Subject: Re: JBrowse callback functions used for track color

[△EXTERNAL]

Hi Vaneet,

Coloring things in gene tracks can be tricky; the feature that is being considered when the color is applied is (I think) the transcript-level feature, not the parent gene. So if you've attached an attribute to the parent gene that you want to use, you actually have to get the parent feature first. As an example, I have this function:

parentRainbowHeatMap = function(feature) {
    var score = feature._parent.get('score');
    var max = 0.01;
    var min = 2.50;
    if(score<max) {score = max;}
    if (score >min) {score = min;}
    var blueness = 190*((score-min)/(max-min));
    var hex = Math.round(blueness).toString(16);
    if (hex.length < 2) { hex = '0' + hex; }
    var color = '#' + hex + hex + 'DD';
    return color;  }

that gets the parent feature's score in order to determine the color of the transcript.

For the red transcripts--I think the gene glyph is trying to determine if a transcript is noncoding and if it thinks it is, it colors it red. I'm not positive about that though--I pretty much never use the default color in gene tracks :-)

Scott

On Tue, Sep 12, 2023 at 1:37 PM Vaneet Lotay <van...@uc...<mailto:van...@uc...>> wrote:

Hi Scott,

If you or anyone in the JBrowse community can help me with this, I’d appreciate it.  I’ve used callback functions before successfully to add links within the ‘View details’ box for various attributes.  Now what I would like to do is color specific genes in my GFF3 a certain color depending on a certain attribute.  What I’ve done is added a ‘tag’ attribute that would indicate whether the gene is a non-coding gene or not as well as other types, like so at the end of the 9th column of the GFF3:

ID=gene-LOC115920884;Dbxref=Echinobase:ECB-GENE-23010450,GeneID:115920884;Name=LOC115920884;gbkey=Gene;gene=LOC115920884;gene_biotype=lncRNA;tag=non-coding

Then I defined a callback function which would extract this attribute and pick the color based on the value, while keeping what I believe is the default JBrowse track color as the backup option (goldenrod):

customColor = function(feature) {

        gtag = feature.get('tag');

        if (gtag == 'pseudoduplicate') {

                return 'magenta';

        } else if (gtag == 'non-coding'){

                return 'green';

        } else{

                return 'goldenrod';

        }

        return 'goldenrod';

        }

Then under the style stanza of the track I added the call to the function:

         "style" : {

            "className" : "feature",

            “color” : “{customColor}”

         },

I’ve done this for other callback functions successfully, but perhaps coloring the track behaves differently.  I might also be not extracting the attribute properly from the GFF or my code has errors, please let me know if this is the case.  I have been able to extract other attributes from the 9th column of GFF3 before so I know it’s possible, but just not working as expected here.  Also it seems some of my gene models already seem to be colored red for some reason without this callback function even being used as opposed to goldenrod, I’m not sure if that’s default JBrowse behaviour, can you explain why that happens?

Thanks,

Vaneet

Vaneet Lotay

Xenbase Bioinformatician

University of Calgary

2500 University Drive NW

Calgary, AB T2N 1N4

CANADA

--
------------------------------------------------------------------------
Scott Cain, Ph. D.                                                  scott at scottcain dot net
GMOD Project Manager (http://gmod.org/)                            216-392-3087
WormBase Developer (http://wormbase.org/)
Alliance of Genome Resources Group Leader (http://alliancegenome.org/)
VirusSeq Project Manager (https://virusseq-dataportal.ca/)
Human Cancer Models Initiative Project Manager (https://hcmi-searchable-catalog.nci.nih.gov/)

--
------------------------------------------------------------------------
Scott Cain, Ph. D.                                                  scott at scottcain dot net
GMOD Project Manager (http://gmod.org/)                            216-392-3087
WormBase Developer (http://wormbase.org/)
Alliance of Genome Resources Group Leader (http://alliancegenome.org/)
VirusSeq Project Manager (https://virusseq-dataportal.ca/)
Human Cancer Models Initiative Project Manager (https://hcmi-searchable-catalog.nci.nih.gov/)