Naview: A d3.js Based JavaScript Library for Drawing and Annotating Voltage-Gated Sodium Channels Membrane Diagrams

Voltage-gated sodium channels (Nav) are membrane proteins essential to initiating and propagating action potential in neurons and other excitable cells. For a given organism there are often multiple, specialized sodium channels found in different tissues, whose mutations can cause deleterious effects observed in numerous diseases. Consequently, there is high medical and pharmacological interest in these proteins. Scientific literature often uses membrane diagrams to depict important patterns in these channels including the six transmembrane segments (S1-S6) present in four different homologous domains (D1-D4), the S4 voltage sensors, the pore-lining residue segments and the ion selectivity filter residues, glycosylation and phosphorylation residues, toxin binding sites and the inactivation loop, among others. Most of these diagrams are illustrated either digitally or by hand and programs specifically dedicated to the interactive and data-friendly generation of such visualizations are scarce or non-existing. This paper describes Naview, an open-source javascript visualization compatible with modern web browsers for the dynamic drawing and annotation of voltage-gated sodium channels membrane diagrams based on the D3.js library. By using a graphical user interface and combining user-defined annotations with optional UniProt code as inputs, Naview allows the creation and customization of membrane diagrams. In this interface, a user can also map and display important sodium channel properties, residues, regions and their relationships through symbols, colors, and edge connections. Such features can facilitate data exploration and provide fast, high-quality publication-ready graphics for this highly active area of research.