Msmultiview is a jQuery plugin for managing mass spectra in many ways. It works either online / offline in a browser. It is build on jQuery, jQuery UI and Highcharts libraries.
- Graphical representation of mass spectral data
- Manage (sort, delete, export...etc) chart list within multiple browser windows
- Zoom in and out of chart areas
The source code contains non-ASCII characters and must be served with UTF-8 encoding, either via the charset="utf-8" attribute on the script tag or by adding <meta charset="utf-8"> to the page top.
To install plugin into your page, first include jQuery, jQuery UI and Highcharts JS files.
// jQuery
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
// jQuery UI
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
// Highcharts
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
// MassBank MultiView
<script src="js/msmultiview.js" type="text/javascript"></script>Make a container <div> and give it an identifier like an ID or a Class.
<div id="ms-multiview"></div>Using a jQuery selector initialize massbank msmultiview plugin.
<script type="text/javascript">
/**
* Result object
* Keys:
*
* // Compulsory key-value pairs.
* "id" -> Massbank id of chart | String Value. Ex: “KZ0a000005”
* "title" -> Title of chart | String Value. Ex: “KZ0a000005”
* "max_y" -> Chart upper limit | Float Value. Ex: 120.43
* "series_data" -> Data series of chart | Two-dimensional Float Array. List of Pair of X and Y axis values. Ex: [[100.2, 10.78], [80.0, 50.0]…]
*
* // Other custom key-value pairs as user needs.
*/
mv.event.chart.load.success = function( response, status, xhr ) {
// TODO: implement data convertion code here.
}
$(window).load(function () {
$( "#ms-multiview" ).msmultiview( /* parameters */ );
});
</script>For customization, visit the Specifications page.
For code samples, visit Samples page.
Run npm install && npm run build to run webpack and uglify-js. Concatenated and minified output is written to ./target/js.
This plugin supports so-called “modern” browsers, which added support of the HTML5 such as IE 11, IE Edge, stable Chrome, Safari and stable Firefox.
MassBank MultiView is free plugin, licensed under the creative commons CC-BY, Version 3.0.
MassBank MultiView plugin is copyrighted © 2016-present Massbank Developing Team at RIKEN CSRS.