Is There Any Tools/Libraries To Use For Visualizing Genomic Feature Data In The Browser?

Question

[inadamj]

I have a genomic data in CSV or spreadsheet format(as table) (ex. A_niger_CBS_513_88 )with gene model/ protein domain architecture.

What libraries/tools that allow me to visualize the data (and to add my own tracks of data easily) ? I need something for using it with HTML5 ( web-based tools ) if there is nothing it is ok for desktop tools..

Answer 1

[Pierre Lindenbaum]

You can create a custom genome hub for the UCSC genome browser with your data: http://genome.ucsc.edu/goldenPath/help/hgTrackHubHelp.html

If needed the required files can be hosted on a site like: http://github.com see my blog http://plindenbaum.blogspot.fr/2013/07/playing-with-ucsc-genome-browser-track.html

[inadamj]

Thanks @Pierre I will try to apply your suggestion and see what happens.

[inadamj]

As I understand you create an XML file then convert it to xsl then send it to UCSC then retrieve the output ??

[Pierre Lindenbaum]

no, I wrote a xml file to generate all the files I wanted. But you can do this by hand ( create a fasta file, create a bigbed file... etc...).

Answer 2

[Damian Kao]

Not sure if this is exactly what you are looking for. I wrote a html tool for visualizing gene feature/domain data here: http://www.nextgenetics.net/tools/anno_view/annotator.html

[inadamj]

:) it seems close to what I should do >> could you pleas tell me how can I create something like this .. which tools\libraries ..etc

[Damian Kao]

For the visualizations/DOM manipulations I used d3.js. For the buttons/menus/checkboxes.. I wrote a MVC (model-view-controller) framework from scratch. Although I learned a lot about how the MVC pattern worked, I don't recommend writing it from scratch. You can use backbone.js or angular.js for MVC. I've also read some very cool things about the new react.js from Facebook (it implements a virtual DOM for faster page rendering).

If you want to hack something together fast, learn jquery, backbone.js, d3.js. Those 3 should be enough to create something similar.

[inadamj]

I know about jQuery .. I am not interested to start from the scratch I want to edit some of the available features such as showing the images in SVG format and customize the output. if there is available plugin or library for the genome data that will be great for me.

Answer 3

[Chase Miller]

Scribl is a javascript HTML5 (canvas-based) genomic visualization library. Examples of both code and visualizations are on the home page

http://chmille4.github.io/Scribl/

[inadamj]

Do you have an idea about an SVG based or is there any possibility to convert it to SVG?