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

how does one simply draw a horizontal line across the whole plot?

Open zhangzhen opened this issue 3 years ago • 8 comments

I want to use the rule mark to draw a horizontal line across the whole x-axis and at 2.5 in the y-axis. I don't know how I can do that.

This question has been also asked on BioStars (https://www.biostars.org/tag/gosling.js/).

zhangzhen avatar Oct 22 '21 04:10 zhangzhen

By the way, I also want to know how I can draw vertical lines.

zhangzhen avatar Oct 26 '21 14:10 zhangzhen

Hi @zhangzhen,

Apologize that my answer was delayed and thank you for asking the question on BioStars as well.

The horizontal line that spans the entire track is not currently supported, but let me think about how to support this in our grammar.

Regarding the vertical lines, do you want to draw vertical lines with a static stroke width (e.g., 1px) at given genomic position?

sehilyi avatar Oct 26 '21 15:10 sehilyi

The horizontal line that spans the entire track is not currently supported, but let me think about how to support this in our grammar.

The rule mark of genomespy may be an example you can reference.

Regarding the vertical lines, do you want to draw vertical lines with a static stroke width (e.g., 1px) at given genomic position?

Yes, this is what I want.

zhangzhen avatar Oct 27 '21 02:10 zhangzhen

Regarding the vertical lines, do you want to draw vertical lines with a static stroke width (e.g., 1px) at given genomic position?

Any progress on this?

Zhen

zhangzhen avatar Nov 24 '21 03:11 zhangzhen

Thank you for reminding me of this. I am thinking of the following grammatical support for both horizontal and vertical lines.

Vertical line:

{ data: { 
    type: 'json', 
    values: [{ c: 'chr1', p: 1000  }],
    chromosomeField: 'c',
    genomicFields: ['p']
  },
  mark: 'rule', 
  x: { field: 'p', type: 'genomic' }, ...
}

Horizontal line:

{ data: { 
    type: 'json', 
    values: [{ c: 'chr1', p: 1000, v: 0.5  }],
    chromosomeField: 'c',
    genomicFields: ['p']
  },
  mark: 'rule', 
  y: { field: 'v', type: 'quantitative' }, ... 
}

Dotted lines can be supported by child properties of track.style.

sehilyi avatar Nov 24 '21 19:11 sehilyi

Thank you for reminding me of this. I am thinking of the following grammatical support for both horizontal and vertical lines.

Awesome! When do you plan to release a new version containing this?

Zhen

zhangzhen avatar Nov 25 '21 01:11 zhangzhen

@zhangzhen, the rules should work in linear layouts, as of #601. Refer to the following example on the editor

https://gosling.js.org/?example=RULE

sehilyi avatar Dec 10 '21 22:12 sehilyi

@zhangzhen, the rules should work in linear layouts, as of #601.

Awesome! Thank you very much!

zhangzhen avatar Dec 12 '21 02:12 zhangzhen