Arbitrary Background Coloring?

I’m plotting drug resistant mutations against all SNP mutations, and I like the look of it so far. I’d like to color the background of the plot so that it corresponds to gene boundaries and thought Plot.cell might be a way to do this, but each cell has a tiny value and is barely visible on the plot, so I’m not sure if I’m on the right track with this method. Is there a way to extend the width of the cells to the values I’ve specified in Plot.cell? Or is there a better way to do this? The actual colors are arbitrary and just need to be distinct enough to show where one gene ends and the next begins.

(Any explanation or pointers to documentation are also very welcome. Suggestions to clean up the axis title are also very appreciated!)

Drug Resistant Mutations / neurogenomics / Observable (

Hello, welcome to the forum!
I’ve played a bit with your visualization code, making some “fixes” in terms of the axis and using the tickX mark instead of the Cell to show the boundaries (if i understand correctly).
I’ve also added a couple different versions below using more height:

Let me know if I can clarify the changes more!

1 Like

These are really sharp, thanks a lot. Is it possible to change the colors of the gene segments in the top example?

Btw, I really love the third plot with the nucleotides. I don’t know if this is the one we’ll present or not, but it’s so cool. Really neat way of visualizing it!

1 Like

yes, sorry for the delay!
You can customize the color scale quite a bit: GitHub - observablehq/plot: A concise API for exploratory data visualization

basically you’d add a color configuration like this:

color: {
domain: [ /* list of data values */ ],
range: [ /* list of color values */ ]

I’m glad you like it, i made it vertical so that each point could have at least 1 pixel. you could do a similar faceted version of your first plot as well.

the only potential issue is that the consensusB values get repeated across facets because the facets are based on the allSNP data.