[HOME] | Web apps and JavaScript in Science |
This page holds continuously updated content related to the articles in Informatics 2017 and Trends in Biotechnology. For hyperlinked tables related to these articles, scroll down or click here.
Principal Components Analysis calculated with LALOlib and displayed with Google Charts: For simple inspection of similarities and differences among complex objects. |
Protein Circular Dichroism Fitter and Simulator through library-free calculations. |
Literature Reporter based on Entrez Utils API and nlp-compromise: Retrieves recent abstracts that mention proteins from a list, removes author names, affiliations and stopwords, and lists the most frequent terms thus providing a glance at the core of the abstract.With a more interesting application, also check out the PubMed protein mutation miner |
Eye tracking-based control of 3D molecular visualizations by coupling WebGazer to JSmol: Uses the webcam to track user's eyes and move a 3D molecule rendered in JSmol. |
Exploring molecules in 3D through Augmented Reality in few lines of code, by integrating Three.js, A-Frame and AR.js: Uses the webcam to detect two markers and thus move a glutamate and lysine sidechains around, returning distances and electrostatic energy between lysine N and glutamate O atoms.This other version suited for phones, which vibrate when atoms clash [see video here] |
Interactive manual + voice-activated force field-based docking of two proteins (ubiquitin-interacting motif onto ubiquitin) achieved by moving the molecules with two markers and switching the forcefield on and off through voice commands (say "computer" and then "activate forcefield" and then "stop forcefield" to stop). You can watch a video demo here |
Interactive manual fitting of protein inside simulated volumetric map (which could come from SAXS or cryo EM data) |
Concurrent JSmol sessions from multiple devices : Uses WebRTC through PeerJS to transmit molecular orientation and commands from and to JSmol applets in different browsers, allowing concurrent collaborative molecular visualization in 3D over the WWW. |
Tool and Link |
Brief Description |
Data visualization |
|
Protein data visualization library for the web. |
|
The first JavaScript-based interactive sequence alignment viewer. |
|
Interactive JavaScript visualization of multiple sequence alignments. |
|
Library to display HeatMaps in the browser. |
|
Framework for biological data visualization. |
|
Library for phylogenetic tree visualization in the browser. |
|
Molecular visualization and editing |
|
Probably the first JavaScript/WebGL-based molecular viewer |
|
A full molecular viewer and editor program and library. See text for details. |
|
Various molecular viewers which profit from WebGL technologies better than JSmol providing nicer and smoother rendering, but which are much more limited in capabilities beyond visualization. Most work as embeddable libraries but are also available as full web apps. |
|
A library to create and edit small molecules graphically, often used as the starting point for subsequent calculations or database queries. |
|
Specially designed to efficiently transfer and visualize raw MD trajectory files on web browsers. |
|
Libraries to edit molecules in 3D. |
|
Full web applications |
|
A tool to analyze amino acid variation in proteins in terms of protein physical chemistry, to aid in the analysis of sequence alignments and deep-sequencing-based tolerance to substitutions maps. |
|
CASP12 web app for assessment of hard modeling targets. |
|
A collection of tools to handle, build, and analyze DNA and protein sequences. |
|
An interactive map to browse the Protein Data Bank. |
|
An interactive 2D structure and substructure search engine for small molecules inside Wikipedia. |
|
Calculates molecular formulas, molecular weights, elemental compositions, and isotopic distribution. Works as full web app or as an API for JavaScript calls. |
|
A portal to a variety of web-based tools for cheminformatics and related fields, including the PDBExplorer and ChemCalc listed above. |
Tool and Link |
Brief Description |
|
Data visualization |
||
Comparing residue contact predictions and protein contact maps |
Web apps to compare protein contact maps from structures or models to residue-residue contact predictions from Gremlin [21], EVFold [22], and RaptorX [23]. |
|
Augmenting article figures of molecular visualization and other data |
Interactive visualization of data and 3D structures/models from published articles. |
|
Molecular visualization and editing; cheminformatics |
||
Interconvert 2D and 3D molecular structures, SMILES and other codes, and coordinate files in several formats. |
||
A web app that provides easy access to JSmol’s model editing ability, also using JSME and API calls to external webservices and databases to provide a full online molecular modeling experience. |
||
A growing suite of functions for manipulating PDB files online, for example shifting residue numbers, getting amino acid sequences, and mapping data to B-factors. |
||
Multiple resources for working with small molecules, NMR, IR and mass spectra, chromatograms, etc. |
||
C++-to-JavaScript port of the open source RDKit chemoinformatics toolkit. |
||
Miscellaneous |
||
Web app version of Expasy’s ProtScale server, which handles multiple sequences simultaneously. |
||
Fit and simulate far-UV protein circular dichroism spectra. |
||
Tool |
Brief Description, Possible Uses, and URL |
Charts |
|
They offer very complete sets of chart types, and are very customizable. |
|
ChartJS, Highcharts JS, Flot |
Also very complete, but here grouped together because they all provide support for older web browsers, yet deliver high-quality graphics, interactivity, and animations in modern browsers. |
Especially suited for plotting streamed data in real time. |
|
D3.js has very broad applications, which allows charting in multiple formats not covered by the libraries mentioned above. Libraries like n3-charts and Ember charts make plotting through D3.js easier. |
|
Mathematics and statistics |
|
A very complete scientific calculator online. |
|
Very complete libraries for mathematics in the browser, with tools for advanced matrix algebra, statistics, optimization, and machine learning. Can be used as libraries for web apps or through a complete environment (LALOLab) similar to that of stand-alone math programs, with its own plotting capabilities. |
|
Another powerful library for mathematics in the browser, also usable through an environment similar to that of stand-alone math programs. |
|
Library for machine learning. |
|
C++-to-WebAssembly port of the LIBSVM support vector machine library |
|
Libraries for neural networks and deep learning, covering from simpler utilities like data and function approximation and regression, to self-organizing maps, image regression and object identification, deep learning, and linguistics. Most can be trained and used online, or trained offline and used online. |
|
jsfft, FFT.js, FFT in many languages, DSP.js, timbre.js |
Libraries for Fast Fourier Transforms; together cover direct and inverse transforms, real and complex convolutions, discrete transforms, and other functions (plus, some are actually full packages for signal processing). |
Math.js, Sushi, numbers.js, jstat, rift, science, glMatrix |
Other math libraries, some with unique features or tailored for specific applications (for example, rift is intended for games, glMatrix, and Sushi for efficient matrix calculations) |
Strings |
|
Functions that extend those of standard JavaScript strings. |
|
textmining and text-miner |
Two similar packages for text mining. Potentially useful for mining contents in large corpuses of scientific text; Figure 1B of this article was built using such techniques. Text-miner includes lists of stopwords in four languages. |
Two libraries for natural language processing. |
|
User interfaces |
|
WebGazer |
Eye tracking library that uses common webcams to infer eye-gaze locations of the user on the web page in real time. Could be used to facilitate molecular visualization as shown in this proof-of-concept example. |
Tangle |
Library to create reactive documents, i.e., which interact with the user in a contextual manner and virtually immediate response. |
MathJax |
Library to display formatted maths in the browser. |
Emulators and programming |
|
Two complete emulators of a linux system, the second including internet connectivity and a graphical interface. Could be used for learning linux in a safe and simple environment for example at the beginning of a tutorial course that requires linux knowledge; also for executing shell commands and scripts as well as programs written for Perl, Python, or even compiling C code, etc. on non-linux computers without the need for complex installations, as exemplified with the NESmapper Perl script. |
|
Online programming environments |
The two linux emulators listed above include C compilers and allow running Perl, Python, etc. Moreover, there are JavaScript-based web applications specifically tailored for writing, compiling, and running programs. Some notable links: site for learning and running C at http://cs-education.github.io/sys/#VM ; a Perl interpreter at |
A working online version of the linux vi editor, could be used to quickly process text files in non-linux computers. |
|
3D graphics, computer vision, and augmented and virtual reality |
|
Three.js is probably the most used library for animated 3D graphics, using WebGL. Applications are in molecular visualization and in more generic data visualization, but beyond these uses, it includes multiple numerical algorithms that could be recycled for other purposes. |
|
Computer vision and image processing libraries which can identify and track objects or markers. Just like Three.js, they include numerical algorithms that could be used for other purposes. Put together with graphical libraries like Three.js leads directly to augmented reality web apps. |
|
Efficient image processing and manipulation in JavaScript |
|
Libraries for optical character recognition from images, useful for retrieving information from article figures. |
|
Hardware and communication |
|
Not a library but a collection of standards, protocols, and APIs for real-time server-less, plugin-free communication and data exchange directly between web browsers. |
|
Browser-to-browser transfer of data, video and audio. Potential applications for concurrent visualization and collaboration. |
|
A web app that guides guitar tuning; exemplifies how to read microphone data and analyze the signal through Fourier transforms to decompose the frequency spectrum. |
|
Speech recognition library to control web page with voice commands. |
|
Simplified access to gyroscope and accelerometer information, expanding the information provided by the built-in Geolocation API (which only locates the user’s position based on network and/or GPS data but gives no orientation information). |
|
Access to primary GPS data. |
|
Libraries to run calculations on Graphical Processing Units (video cards) |