AltGosling is a library based on Gosling that automatically extracts features and converts these into natural language to describe Gosling visualizations.
There is a large gap in accessibility, specifically for people with blindness and low vision (BLV), on the web. The Web Content Accessibility Guidelines (WCAG) require text descriptions for images. AltGosling creates text descriptions for genomic visualizations created with Gosling. In this way, interactive visualizations can be deployed on the web and automatically include text descriptions.
AltGosling is available as an NPM package.
Install it with your favorite package manager.
npm install altgosling
The fastest way to get AltGosling running is shown below.
import React from 'react';
import gosling from 'gosling.js';
import { AltGoslingComponent } from 'altgosling';
function Demo() {
// example spec
const goslingSpec = {
"title": "Tonsil ChIP-seq in Th1 cells",
"tracks": [
{
"layout": "linear",
"width": 800,
"height": 180,
"data": {
"url": "https://resgen.io/api/v1/tileset_info/?d=UvVPeLHuRDiYA3qwFlm7xQ",
"type": "multivec",
"row": "sample",
"column": "position",
"value": "peak",
"categories": ["sample 1"],
"binSize": 5
},
"mark": "bar",
"x": {"field": "start", "type": "genomic", "axis": "bottom"},
"xe": {"field": "end", "type": "genomic"},
"y": {"field": "peak", "type": "quantitative", "axis": "right"},
"size": {"value": 5}
}
]
}
return (
<>
<AltGoslingComponent spec={goslingSpec}/>
</>
);
}
A demo of AltGosling is available here.
All examples are available in demo/examples.
We welcome contributions to AltGosling! Please refer to the contributing guidelines.
- Thomas C. Smits
- Sehi L'Yi
- Andrew P. Mar
- Nils Gehlenborg
Questions can be directed towards nils@hms.harvard.edu
Our preprint is available here.
Please cite this work as follows:
TC Smits, S L’Yi, AP Mar, N Gehlenborg. “AltGosling: Automatic Generation of Text Descriptions for Accessible Genomics Data Visualization”, OSF Preprints (2024). doi:10.31219/osf.io/26jvr