React sequence logo component
npm install react-seqlogoThis React component renders residue sequence logos from a structured Javascript object (described below) containing FASTA-formatted sequences, or a string containing a MEME motif table. This component can also be used to render an Epilogos stacked bar-chart of chromatin state logos from Epilogos-MEME table data.
In your React project, install the react-seqlogo package:
``
$ npm install react-seqlogo
This package is hosted from NPM. Source is available at Github.
Add a sequence logo to your React application with desired properties:
`
import SequenceLogo from 'react-seqlogo';
...
`
This project includes a demo frontend that shows how one could use this component:
`
$ npm run start
Once the server has initialized, open a web browser and visit: http://localhost:8080
Available properties (and their default values or options) for the main component include:
`
{
title : '',
mode : 'FASTA' | 'MEMEMotif',
colorScheme : 'base_pairing' |
'charge' |
'chemistry' |
'classic' |
'epilogos-15state-human' |
'epilogos-18state-human' |
'epilogos-25state-human' |
'epilogos-15state-mouse' |
'hydrophobicity' |
'nucleotide' |
'taylor',
item : {} | '',
type : 'nucleotide' | 'protein' | 'epilogos',
yAxisTicks : 2,
svgWidth : 600,
svgHeight : 300,
svgLetterWidth : 510,
svgLetterHeight : 210,
svgMargin : {
top : 20,
right : 0,
bottom : 10,
left : 25
},
}
At minimum, an item is needed to turn into a sequence logo. The item property ultimately provides the base counts needed to render a logo, either in the form of raw sequences or letter frequencies.
An item may be a structured Javascript object containing FASTA-formatted sequences or a string containing a MEME motif table, depending on the specified mode.
The logo that results will be colored and rendered with attributes and rules derived from the colorScheme and type properties.
Very simply, an item is a pairing of an identifier string and a sequences string:
`
{
identifier : '',
sequences : ''
}
For example:
`
{
identifier : '3 ad-hoc RNA sequences',
sequences :
CUUAUAUCCUUACC
>seq002
CUCGCGUGUCAAUC
>seq003
CTCCCGUUGCAAUC
}
The sequences string is more familiar as the contents of a generic, multiline FASTA file. The identifier` gives the sequences a usable title.
A MEME motif is a string contains metadata describing the item and the letter-probability matrix, which is turned into a sequence logo. The format of this string is defined here.
At this time, there are rendering problems with residues in protein sequence logos.
Also, not all features of WebLogo 3 are supported. Future versions may add support for alternate units such as probability density and nats, error bars, logo range subsets and offsets, and background composition correction.