populationgenomics / variant-curation-portal

Web application for curating loss of function variants
MIT License
1 stars 0 forks source link

Add charts to variantdata #64

Closed EddieLF closed 9 months ago

EddieLF commented 9 months ago

Displays charts on the VariantData page with react, using chart.js and the wrapper react-chartjs-2 and antd for in tabs. See https://github.com/populationgenomics/variant-curation-portal/pull/61 for the four new fields added recently.

The Genotype Qualities can take a value from 1-100 and these are binned into bars of width 5.

The Read Depths can take a value from 1-N and are binned into bars of width 5 also.

The Allele Balances are calculated from the Allelic Depth array [[REF,ALT], [REF,ALT], ..., [REF,ALT]], where each balance is AB=ALT/(REF+ALT). These take values in the range [0, 1.0] and are binned into bars of width 0.05.

The null handling means that for older variants without these fields populated, nothing will be shown on the charts.


Please see this video for a demo of the new charts: Google Drive Link to Screen Recording


This is in an effort to recreate the charts provided by GnomAD, such as this one: gnomad_chart

cassimons commented 9 months ago

LGTM. Can you add a couple of screen grabs showing what the final result looks like?

EddieLF commented 9 months ago

@cassimons

For a random variant:

Genotype qualities: [99, 99]

Screenshot 2024-01-17 at 9 18 29 am

Read Depths: [76, 52]

Screenshot 2024-01-17 at 9 18 35 am

Allelic Balances: [0.37, 0.56] (from Allelic Depths: [[48, 28], [23, 29]])

Screenshot 2024-01-17 at 9 18 43 am

For a random variant with no values for GQ_all, DP_all, AD_all, the charts are empty:

Screenshot 2024-01-17 at 9 22 35 am
cassimons commented 9 months ago

I am happy with this, @illusional can you pls approve if/when you give the 👍 ?