- Aitor Blanco Míguez ([email protected])
- Dr. Florentino Fernández Riverola ([email protected])
- Dr. Anália Maria Garcia Lourenço ([email protected])
- Dr. Borja Sánchez García ([email protected])
- Thomas Roder ([email protected])
A free to use, open source Javascript BLAST alignments viewer library created by SING group.
Blanco-Míguez A, Fdez-Riverola F, SánchezB, Lourenço A (2018) BlasterJS: A novel interactive JavaScript visualisation component for BLAST alignment results. PLoS ONE 13(10): e0205286. https://doi.org/10.1371/journal.pone.0205286
- Bootstrap 3 (http://getbootstrap.com/)
- HTML2CANVAS ([http://html2canvas.hertzen.com/])
BLAST text and XML output files (-outfmt 0 and 5)
You can check NCBI BLAST user manual.
Install the module with: npm install biojs-vis-blasterjs
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"
integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"/>
<link rel="stylesheet" type="text/css" href="css/blasterjs-colors-nucleotides.css"
id="stylesheet-blasterjs-nucleotides"/>
<link rel="stylesheet" type="text/css" href="css/blasterjs-colors-proteins.css"
id="stylesheet-blasterjs-proteins"/>
...
</head>
<body>
...
<input type="file" id="blastinput"/>
<div id="blast-multiple-alignments"></div>
<div id="blast-alignments-table"></div>
<div id="blast-single-alignment"></div>
...
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
<script type="text/javascript" src="js/blaster.js"></script>
<script type="text/javascript">
// activate the appropriate stylesheet
document.getElementById('stylesheet-blasterjs-nucleotides').disabled = true
document.getElementById('stylesheet-blasterjs-proteins').disabled = false
// start blasterjs
let blasterjs = require("biojs-vis-blasterjs")
let instance = new blasterjs({
input: "blastinput",
multipleAlignments: "blast-multiple-alignments",
alignmentsTable: "blast-alignments-table",
singleAlignment: "blast-single-alignment"
})
</script>
</body>Get alignments via String instead of input form:
...
<script type="text/javascript">
var alignments = "...";
var blasterjs = require("biojs-vis-blasterjs");
var instance = new blasterjs({
string: alignments,
multipleAlignments: "blast-multiple-alignments",
alignmentsTable: "blast-alignments-table",
singleAlignment: "blast-single-alignment",
});
</script>
...Define a custom callback on alignment table item click event:
...
<script type="text/javascript">
var blasterjs = require("biojs-vis-blasterjs");
var instance = new blasterjs({
input: "blastinput",
multipleAlignments: "blast-multiple-alignments",
alignmentsTable: "blast-alignments-table",
singleAlignment: "blast-single-alignment",
callback: function (alignment) { ...
}
});
</script>
...[© SING - Sistemas Informáticos de Nueva Generación 2015]
Department of Computer Science, University of Vigo
ESEI - Escuela Superior de Ingeniería Informática Edificio politécnico
Campus Universitario As Lagoas s/n
32004 Ourense, Spain
Tel: +34 988 387 013
Fax: +34 988 387 001
All contributions are welcome.
If you have any problem or suggestion please open an issue here.
BlasterJS is a free to use, open source JS library created by SING Group. Copyright (C) 2019 SING - Sistemas Informaticos de Nueva Generacion
This program is free software: you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.
This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details.
You should have received a copy of the GNU General Public License along with this program. If not, see http://www.gnu.org/licenses/.