@lipme/gffcolors NPM

GffColors

GffColors is a visualization tool for GFF3 files, allowing users to explore and understand the genomic data based on specified attributes.

Recommended IDE Setup

VSCode + Volar (and disable Vetur).

Quick Start

Install

npm install @lipme/gffcolors

Use in a Vue Project

import { ColorService } from '@lipme/gffcolors'
import { OntologyStrategy } from '@lipme/gffcolors'
// Initialize ColorService with the color dictionary (can be a JSON or a variable)
const colorDict = new ColorService(colors)
// Set the current dictionary you want to use
colorDict.setCurrentDict('MolecularFunction')
// set a specific coloring strategy
const ontology = new OntologyStrategy()
// Adapt the dictionary to the coloring strategy
await ontology.adaptDict(colorDict.currentDict!)
//set the coloring strategy
colorDict.coloringStrategy = ontology
// Use the colorService on the gene to get the color
const color = colorDict.getCdsColor(gene)

import { ColorService } from '@lipme/gffcolors'
import { ClassificationStrategy } from '@lipme/gffcolors'
// Initialize ColorService with the color dictionary (can be a JSON or a variable)
const colorDict = new ColorService(colors)
// Set the current dictionary you want to use
colorDict.setCurrentDict('COG')
// set a specific coloring strategy
const dbXrefStrategy = new ClassificationStrategy()
//set the coloring strategy
colorDict.coloringStrategy = dbXrefStrategy
// Use the colorService on the gene to get the color
const color = colorDict.getCdsColor(gene)

import { ColorService } from '@lipme/gffcolors'
import { DefaultColorStrategy } from '@lipme/gffcolors'
// Initialize ColorService with the color dictionary (can be a JSON or a variable)
const colorDict = new ColorService(colors)
// Set the current dictionary you want to use
colorDict.setCurrentDict('FunctionalClass')
// Optionally, set a specific coloring strategy
const defaultColorStrategy = new DefaultColorStrategy()
//  Optionally,set the coloring strategy
colorDict.coloringStrategy = defaultColorStrategy
// Use the colorService on the gene to get the color
const color = colorDict.getCdsColor(gene)

Example of a Color Dictionary

{
  "customColorsList": [
    {
      "title": "Example mRNA",
      "level": "CDS",
      "attribute": "Dbxref",
      "colors": [{ "match": "Example Match", "color": "#FF0000", "label": "Example Label" }]
    }
  ],
  "default": {
    "mRNA": "blue",
    "ncRNA": "green",
    "rRNA": "red",
    "tRNA": "purple",
    "insertion_sequence": "orange",
    "unknown": "black",
    "match_part": "gray",
    "region": "yellow",
    "utr": "pink"
  }
}

There must be a type color dictionary and at least one element in customColorsList. There must not be a color in default that is found in customColorsList.