gosling.js icon indicating copy to clipboard operation
gosling.js copied to clipboard

Share y-scale and show only one axis in overlaid tracks

Open sehilyi opened this issue 4 years ago • 3 comments

image

This happens when multiple tracks w/ different data are overlaid. This is not handled properly. Currently, only the tracks with the same data share the y axis.

Spec with an issue:

{
  "title": "HBM395.NRTL.659 Bulk ATAC-seq Data Raw",
  "subtitle": "Narrow Peaks and Summits",
  "views": [
    {
     "layout": "linear",
     "width": 800,
     "height": 180,
     "alignment": "overlay", 
     "tracks": [
      {
       "data": {
        "url": "https://gist.githubusercontent.com/ngehlenborg/9af4c34c65c9b820edda366a7af8d04d/raw/f8017ea25d9a735bb998e438763f2f993df5bde8/NA_peaks.narrowPeak",
        "type": "csv",
        "separator": "\t",
        "headerNames": ["chr", "start", "end", "name", "score", "strand", "signalValue", "pValue", "qValue", "peak" ],
        "chromosomeField": "chr",
        "genomicFields": ["start", "end"]

      },
      "mark": "bar",
      "x": {"field": "start", "type": "genomic"},
      "xe": {"field": "end", "type": "genomic"},
      "color":{ "value": "darkblue"},
      "stroke":{ "value": "darkblue"},
      "strokeWidth": {"value": 0.5},
      "y": {"field": "score", "type": "quantitative"}
    },
    {
     "data": {
      "url": "https://gist.githubusercontent.com/ngehlenborg/9af4c34c65c9b820edda366a7af8d04d/raw/f8017ea25d9a735bb998e438763f2f993df5bde8/NA_summits.bed",
      "type": "csv",
      "separator": "\t",
      "headerNames": ["chr", "start", "end", "name", "score"],
      "chromosomeField": "chr",
      "genomicFields": ["start", "end"]

    },
    "mark": "bar",
    "x": {"field": "start", "type": "genomic"},
    "xe": {"field": "end", "type": "genomic"},
    "stroke":{ "value": "lightblue"},
    "color":{ "value": "lightblue"},
    "strokeWidth": {"value": 1},
    "y": {"field": "score", "type": "quantitative"}
  }  
]
   }
 ]
}


sehilyi avatar Jun 05 '21 00:06 sehilyi

To fix this issue, we need to fix #401 in advance

sehilyi avatar Jun 07 '21 15:06 sehilyi

For now, let's show the second axis on the other side (https://github.com/gosling-lang/gosling.js/pull/402):

Screen Shot 2021-06-07 at 12 32 37 PM

sehilyi avatar Jun 07 '21 16:06 sehilyi

Hi, is there any plan of including this feature? I would like to overlay two tracks visualizing bigwig files, and the users should be able to compare them using the absolute values at every position.

Just as an example of the problem I am having: The bars visualize a value of the BigWig file at every position for two different libraries (Normal = gray, enriched = orange). Since the max value per window is automatically adapted for each track, here it looks like the orange library has a higher value than the gray one. However, using the tooltip, one realizes this is not the case.

image

mwittep avatar Apr 11 '24 07:04 mwittep