Skip to content

Instantly share code, notes, and snippets.

@domitry

domitry/index.html

Last active August 29, 2015 14:02
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save domitry/c1986ee181ae97f29d95 to your computer and use it in GitHub Desktop.
Save domitry/c1986ee181ae97f29d95 to your computer and use it in GitHub Desktop.
Download ZIP
A demo for Ecoli.js (Mutliple panes with VENN plot)
Raw
index.html
<html lang='en'>
<head>
<title>Nyaplotjs example -- Multiple Panes</title>
<script src='http://d3js.org/d3.v3.min.js'></script>
<script src='https://rawgit.com/domitry/Nyaplotjs/master/release/nyaplot.js'></script>
</head>
<body>
<div id='vis1' style='float:left'></div>
<div id='vis2' style='float:left'></div>
<div id='vis3' style='clear:left'></div>
<script>
var mutation_types = ['c->a', 'g->a', 't->a'];
var values = d3.range(100).map(function(val){return {val1: d3.random.bates(10)(val), mutation_type: mutation_types[Math.floor(Math.random()*3)]};});
var model1 = {data:{data1: values},panes: [{type:'rectangular', diagrams:[{type: 'histogram', data: 'data1', options: {value:'val1'}}], filter: {target: 'x'}, options:{width:500, height:500, xrange: [0,1], yrange: [0,30], scale:'fixed',grid:true, x_label:'PNR', y_label:'Frequency', legend:false}}]};
var model2 = {data:{}, panes:[{type:'rectangular', diagrams:[{type:'bar', data: 'data1', options: {value:'mutation_type'}}],options:{width:400, height:500, xrange:['c->a', 'g->a', 't->a'], yrange: [0,100], scale:'fluid', grid:true, x_label:'indivisual 1', y_label:'Relative Conditions', legend_options:{title: 'mutations'}}}]};
var model3 = {data:{}, panes:[{type:'rectangular', diagrams:[{type:'venn', data: 'data1', options: {category:'group',count:'mutation_type'}}],options:{width:600, height:500, xrange:[0,1], yrange: [0,1], scale:'fluid', grid:true, x_label:'', y_label:''}}]};
window.onload = function(){
Nyaplot.core.parse(model1, '#vis1');
Nyaplot.core.parse(model2, '#vis2');
Nyaplot.core.parse(model3, '#vis3');
};
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment