igvteam / igv-webapp Goto Github PK
View Code? Open in Web Editor NEWIGV Web App
Home Page: https://igv.org/app
License: MIT License
IGV Web App
Home Page: https://igv.org/app
License: MIT License
There should not be a default "embedTarget". If the value isn't set the "Embed" button should not be visible. This is better than creating a snippet referencing a file that does not exist.
I followed the instructions to install and run the IGV webapp. It works like a charm.
I can load bigwig files using the GUI without problem.
I don't have any experience in Javascript.
I just want to initiate the IGV webapp together with the local bigwig files. I tried to modify genomes.json, "tracks": [ ... ] without success. What would be the easiest approach to load specific local files as made available from igv-webapp/dist/resources/? Which file should I need to modify? An example would be appreciated. Thanks a lot for your efforts.
"tracks": [
{
"type": "wig",
"name": "H3K4me1",
"format": "bigwig",
"filename": "example_data_hg19.bw",
"url": "resources/localdatafolder/example_data_hg19.bw",
"sourceType": "file",
"color": "rgb(150,150,150)",
"autoscale": true,
"height": 50,
"order": 2
}
]
The input file could be in json or xml (IGV desktop) format. browser.loadSession supports both.
Searching e.g. 'Gapdh' using mm10 directs you to chr4:157,675,396-156,508,116, where in fact Gapdh is on chr6. Same problem for other genes. Works fine using hg19 or hg38.
Hello! How can I access my page? I've now done this,
if I go directly to http://localhost:8081
The connection failed,
so what should I do next? What's wrong with me?Thank you!
bash-3.2$ npm install
audited 4342 packages in 1.902s
7 packages are looking for funding
run npm fund
for details
found 98 vulnerabilities (97 low, 1 moderate)
run npm audit fix
to fix them, or npm audit
for details
bash-3.2$ npm start
[email protected] start /Users/shihai/Desktop/IGV_JS/igv-webapp-master
http-server -a localhost dist
Starting up http-server, serving dist
Available on:
http://localhost:8080
Hit CTRL-C to stop the server
[2020-03-09T20:33:08.641Z] "GET /" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:68.0) Gecko/20100101 Firefox/68.0"
(node:32056) [DEP0066] DeprecationWarning: OutgoingMessage.prototype._headers is deprecated
[2020-03-09T20:33:08.648Z] "GET /" Error (404): "Not found"
Hello,
I installed this IGV web app on a lab's server, and it works like a charm. Thanks for the hard work.
An issue we are currently facing is that when we want to share datasets, tracks are missing. Probably because they were imported from "Local Files"?
I was wondering if there would be an easy solution to add a "Server file" option in the "Tracks" and "SessIon" dropdown menus. So we can see the files on the server hosting the web app.
Thanks in advance
I've edited the resources/genomes.json
file to look like this:
[
{
"id": "Pgenerosa_v070",
"name": "Panopea generosa (v070)",
"fastaURL": "http://owl.fish.washington.edu/halfshell/genomic-databank/Pgenerosa_v070.fa",
"indexURL": "http://owl.fish.washington.edu/halfshell/genomic-databank/Pgenerosa_v070.fa.fai"
}
]
I've also edited the igvwebConfig.js
to look like this:
/**
* Configuration file for igv-webapp. This is intentionally not a module so it can be used pre and post webpacking
*/
"use strict";
var igvwebConfig = {
genomes: "resources/genomes.json",
trackRegistryFile: "resources/tracks/trackRegistry.json",
embedTarget: 'https://igv.org/web/release/2.2.14/embed.html',
igvConfig:
{
genomeList: "resources/genomes.json",
queryParametersSupported: true,
showChromosomeWidget: true,
showSVGButton: false,
genome: ,
// Supply a Google API key to access public Google resources. This is optional.
apiKey: "API_KEY"
},
// Supply a Google client id to enable the Google file picker in the load menus. This is optional
clientId: "CLIENT_ID",
// Provide a URL shorterner function or object. This is optional. If not supplied sharable URLs will not
// be shortened.
urlShortener: {
provider: "bitly",
apiKey: "BITLY_TOKEN"
}
};
Yet, when I launch the web app, hg19 is already loaded, the Genomes drop down menu is still populated with the default list, and my custom genome is not listed in the Genomes drop down menu.
Any help on why I can't eliminate the default genomes and/or load my custom genome would be great. Thanks for looking into this!
The gapi is heavy and only needed for supporting the "Google" picker button. We should defer loading the gapi until the picker button is first accessed, if that's possible.
Clamp feature extent on canvas2svg.js. Use track clip rect to clip feature extent.
Dear IGV app developers,
I have been using a IGV-Browser app session with plenty of sessions linked to a public Google cloud bucket. It used to work fine, but now it says "Error loading data" in every single track. When trying exactly the same "gs:" path in the IGV Desktop app, it loads it and there is not a problem.
Are you aware of any issue like that affecting other users?
I can give you links to the files if necessary.
Thanks in advance for your help.
Best,
Alex
Add updatable release number to Web page.
It would be great if I could load crams, etc. from google buckets via gs:// paths.
Hi,
I am Computational scientsit in a sequencing plateform.
I just installed igv-webapp on our server.
Our server in on a secure network only accessible with a vpn client.
**I can acess IGV and load file from my computer, but when i go to the page I have the following message : **
[Thu May 28 2020 12:41:04 GMT+0200 (GMT+02:00)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/77.0.3865.120 Safari/537.36"
[Thu May 28 2020 12:41:04 GMT+0200 (GMT+02:00)] "GET /css/app.css.map" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/77.0.3865.120 Safari/537.36"
[Thu May 28 2020 12:41:04 GMT+0200 (GMT+02:00)] "GET /igv.css.map" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/77.0.3865.120 Safari/537.36"
[Thu May 28 2020 12:41:04 GMT+0200 (GMT+02:00)] "GET /css/app.css.map" Error (404): "Not found"
[Thu May 28 2020 12:41:04 GMT+0200 (GMT+02:00)] "GET /igv.css.map" Error (404): "Not found"
I made sure that the user rights are OK.
My real problem is the following:
I tried to open a bam file with the following URL (Both the igv-webapp and the bam +( bam.bai) are on the same server) :
http://IP:8080/?load?genome=hg19&file=http://IP:8080/users/home/MYBAM.bam
When i zoom in i get the following error:
"Error loading Track data"
My web browser show me this error:
igvxhr.js:260 GET http://IP/users/home/MYBAM.bam.bai 404 (Not Found)
bamSource.js:157 Error: 404
at b (igvxhr.js:268)
at igvxhr.js:240
at tryCatch (app_bundle.js:56)
at Generator.invoke [as _invoke] (app_bundle.js:276)
at Generator.prototype. [as next] (app_bundle.js:109)
at $r (runtime.js:725)
at o (runtime.js:725)
at runtime.js:725
at new Promise ()
at XMLHttpRequest. (runtime.js:725)
and my consol give me this one :
"GET /users/home/MYBAM.bam Error (404): "Not found"
I also update CORS but thats not working and it is not suppose to be relevant (if I understood correctly)
I really need to be able to open the BAM file via URL, to make our analysts work easier.
Thanks a lot and i hope not to be redondant with other issues but I didn't find thi specific problem.
Thanks a lot,
Tristan
Select Tracks > Google Drive
Log in and load a track (the one I tried was private).
Select Share and copy the bit.ly URL
Paste the URL into another browser window. The track is created but the data doesn't load.
Same behavior if you save and load a bookmark.
However, If you save a session via Session > Save, and then open the session everything works ok.
Hi, I'm trying to load a bam (+index). When I point my browser to the URL, it downloads the bam, so it is accessible. There is an error loading track data. If I download locally the data will display.
A link to the session is here: http://bit.ly/2MQaFiD
I'm having no luck uploading my own genome (*fa, *fai) and BED file to https://igv.org/app/ ("Local file" option). The genome appears, but not the track.
You know what would be useful? An example BED file that works, like "ecoli.bed" to go along with "ecoli.fa" and "ecoli.fa.fai", in the genomes/ dir.
I can add tracks to be loaded via. Tracks menu (resources/my_track.json and listing it in trackList.json). However, I would like to load/show a few bigWig files by default on the browser. Is this feature possible with the browser?
Thanks,
Parul
Hi!
I cloned this repo, and am using it inside my local server. I understand that any commits you push now won't be reflected inside my server unless I pull a fresh copy of the repo.
But, I was wondering if there are any code snippets that rely on external resources and might affect stability of IGV Web App. i.e is there any chance that this cloned copy of IGV could crash or suffer downtime due to reliance on external resources?
I might not be explaining my problem very well, so let me know if you need more clarification. I'd be happy to provide it.
In Firefox, if you try to load something from Google Drive or Dropbox, the picker window doesn't pop up at all. I thought perhaps I was blocking pop-up windows, but that wasn't it.
Add a button to save the current session to a json file. The session json is obtained from the function igv.Browser.prototype.toJSON. The following snippet can be used for the download
const filename = <from user>
const sessionJson = browser.toJSON();
const data = URL.createObjectURL(new Blob([sessionJson], {
type: "application/octet-stream"
}));
igv.download(filename, data);
Testing 123. Ignore.
Selecting just the fasta fails with the error below (silent as far as the user is concerned). We should popup a dialog aksing the user to specify the index. Ditto for dropbox & google drive (not tested).
igv.js:39359 GET http://localhost/igv-webapp/[object%20File].fai 404 (Not Found)
When I try to load a genome FastA and corresponding FastA index from Google Drive (both files are publicly available), I get a pop-up box with the message "Access Forbidden".
Any thoughts on how to get around this?
The checkmarks are tiny in the gear menu. I think this was fixed in the latest igv.js, but the web-app is using 2.2.4.
Does igv-webapp support GWAS manhattan plot or is this feature only available for igv.js (I saw this track recently been added to igv.js!)
Thanks!
Search for a gene and it displays an error message: "Not found".
Tthe JavaScript console shows it's trying to use
https://igv.org/app/igv.org/services/locus.php
as the service. But the service is here:
https://igv.org/services/locus.php
Hi,
I am trying to add a local fasta and its gff3 file as reference.
I clicked on the Genome->local File get the following error message "igvTest.genome.fa ERROR: index file must also be selected". Is index file required even for one contig fasta? My fasta file is one contig file looks like
">sequence01 NODE_1_length_1770022_cov_224.147834
AGATTTCCCATAGCGTAAGCTAGTAAGATCCCTGAAAGATGATCAGGTTGATAGGTTCGA ...."
I clicked on the Tracks->Local file trying to load the gff3 file. Got the following alert "URL malformed". My gff3 file looks like
"sequence01 BBTools CDS 461955 463025 683 + 0 frame=2;startScr=1.309;stopScr=0.240;innerScr=0.300;start=TTG;stop=TGA"
Do i need to write a json file ./resources/tracks/ for my local ref genome and modify the ./resources/gemones.json manually?
Is there an APP in igv-webapp that create .genome file? Something similar to the one used in the desktop top IGV.
Thank you very much for your help.
shihai
B-10, Los Alamos National Lab
Hey,
I am using the IGV Web app repo (pulling JS from a release tag for stability) and delivering it as a static resource in my Flask server. The contents of the igv-webapp are delivered in an iframe inside one of the pages of my application.
Its working great when I search for loci in the search bar inside the iframe. The issue is that sometimes (usually after about 20 searches but I'm not sure if the number has anything to do with it), the igvwebapp will keep loading the requested locus forever. Ultimately, causing Chrome to crash.
First, I wanted to make sure that my own javascript wasn't causing these issues, so I've been diligently optimizing my code. Chrome doesn't crash anymore, so that was definitely me. But even after this, sometimes the loading for requested locus will take forever :(
Second, I tried to deploy my Flask server to production. I read online that development servers can sometimes underperform, so I deployed a gunicorn server. Even on the production server I deployed, after a few searches, the loading for requested locus takes forever :(
To check if Flask itself was the issue, I also tried searching for loci on your deployed app igv.org/app and it works similarly, i.e. works great most of the time, but after a few consecutive searches, the loading starts taking forever.
I was hoping you could shed some light on this issue. And I wanted to thank you for responding so quickly to my previous questions. You've been really helpful! 🙂
And of course, please let me know if you need any more information or specifics!
Best,
MarkleLab
After I start the app and then enter the URL (http://localhost:8080) in a browser (Brave, Firefox), nothing shows in the browser, but the terminal shows the following error message(s):
Brave error:
Firefox error:
Running this on Ubuntu 16.04 LTS.
Any tips on how to get this running? Thanks for looking into this!
Hey!
I am using your repo and making certain modifications to the app according to my lab's requirements.
I would like the server to listen on a port for uploads and downloads (of an array of strings if that matters). But, I can't easily find a server variable that I can add to. I tried instantiating an Express server but that doesn't work either since it'd have to be on a different port.
What I'm trying to do: I am uploading a csv file, the user interacts with it on the front end, and then I would like to call a python function through the backend that does some quick formatting on the csv, and makes it available for download to the user.
Issue I'm facing: I can't figure out how to send some form data and the uploaded file to the backend for further processing. And, then send a file back from the backend to the front-end to make the file available for user download.
I would really appreciate any insight/guidance. Also, I know this is more like a "help wanted" rather than an issue, but I can't change the label of my post.
Thanks!
Milind
Trying to add data from this link:
https://storage.googleapis.com/gnomad-public/release/2.1.1/vcf/genomes/gnomad.genomes.r2.1.1.sites.22.vcf.bgz
Error message:
Track File Error
Invalid Files
gnomad.genomes.r2.1.1.sites.22.vcf.bgz
It looks like it wants a .gz file. Is there an extension that supports .bgz or is there a step I'm skipping?
Thank you!
I loaded a genome FastA and corresponding index file from a URL. Everything appeared fine (i.e. the chromosomes all showed up in the drop down list for this genome. However, the default track displayed "Error loading track data".
After poking around the issues in this repo, I was able to figure out to look at the browser inspector thingy to see what was going on in my web browser. This is where I saw the CORS policy failure:
Without an error message to alert the user and describe the problem makes it frustrating to use http://igv.org/app.
Aa an aside, I've briefly read about the CORS policy stuff and it's way beyond anything our lab can understand/implement. We have a NAS that we use to host our data files for public/remote access. The server configuration needed to implement CORS (if it's even an option), is well beyond any of our understanding.
In (at least) some of the dialogs there’s a highlighted OK button. If it’s highlighted I assume it’s the default. But hitting enter/return does nothing. I have to click on the button. See for example, the dialog that comes up when you select Tracks > URL.
Ideal behavior: Initially grey out the ok button until you've entered the URL. Then make it the default.
Hello,
I was wondering if it would be possible to load bams from a dir local to the igv web app (i.e. on the server)? or do I have to serve these?
Thanks
Matt
Hi!
I am currently trying to upload my .bam and .bai mapping files and .fa file on the web app. I keep getting errors saying that the mapping files are invalid. The mapping files have the same name but have a different name than the genome fasta file. I hope to upload more read mapping files from other samples that have mapped to this genome but am unable to because of the invalid file
error.
I also wanted to note that the stand alone IGV version is able to upload and view the mapping and fasta files but due to RAM conflicts I am unable to view 2 samples (2.bam files) at a time.
I am happy to send an email containing a .zip file of the mapping and fasta files. (I am unable to upload them here as the file size is large).
Best,
Clarisse
Hey!
I've been using your repo and I added in some functionality to it. My node app suddenly stopped working today. The genome browser part of the web app was not loading. I have been using my app without any changes to the code all day today, but the app won't work anymore.
I cloned a fresh copy of this repo just now to check if that was working, but its not!
Could you look into this please? Here's a screenshot of what my browser looks like when I started up your application.
Best,
Milind
I am trying out igv-webapp for our intranet. Looking great so far and thanks for sharing this app. One suggestion though for shortURLs. I believe google shorturl is now deprecated over firebase dynamic links and bitly seems unstable. It would be better if you can have user-supplied API token for either tinyURL or better, google firebase dynamic link. That way, shorturls are more private and restricted by user supplied api token.
I have been using firebase api for while and it's stable to generate shareable urls. Here is a bash wrapper to generate urls (where FBXK is an api token field). I will tinker with java script to add firebase links at somepoint but thought would be quicker on your end.
Lines 47 to 61 in 0a013c9
This session is supposed to have different colored alignments per tag, but they are all grey.
Hi,
Sorry for the naive question. I really want to get this work but have not been successful after try many times.
I was able to set up igv-webapp.
By running
npm start
I can get it running. However I have two issues:
except hg19 (the default?), everything else will give error:
I cannot change any of the genome list (or the track lists):
I modified my resources/genomes.json
to by deleting all other genomes:
but the genome drop down menu will not change.
similarly i modified resources/tracks/trackRegistry.json
, and will not have effects.
Thank you very much,
Shuoguo
Hi Jim et al.
What are your thoughts about plugin support? I was looking at JBrowse the other day and saw some enormously interesting plugins (mygene/myvariant.info API support? Automated CSQ parsing? Sign me up!)
I would be great if some of those could be incorporated/ported to IGV.js or the webapp. I like jbrowse for the functionality, but the UI needs a lot of work, which IGV already has figured out.
Thanks
M
Hi,
I have numerous saved sessions in xml format to use with the IGV desktop version. We are planning to switch and start using IGV web and I was wondering if you have a script/tool to convert xml sessions to json format.
In the igv-help google group they suggest to load the xml sessions into IGV web, but either it doesn't work for me or they are basically incompatible.
Thanks
Hi,
Would it be possible to add a DOCKERFILE to make a quick test drive possible?
Also, license permitting, this would mighty useful for forking/stealing.
Thanks a bunch!
Cheers
M
Button to save SVG to a file. Prompt user for filename.
Greetings,
If I have an S3 compatible API like minio with genomes on it, can I configure this application to login to an S3 api?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.