block by domitry b8785f02f36deef567ce

A demo for Ecoli.js (Multiple Panes)

Full Screen

index.html

<html lang='en'>
<head>
  <title>Nyaplotjs example -- Multiple Panes</title>
  <script src='//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>
<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: (val>50? mutation_types[0] : mutation_types[1])};});
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], 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], grid:true, x_label:'indivisual 1', y_label:'Relative Conditions', legend_options:{title:'mutations'}}}]};

window.onload = function(){
    Nyaplot.core.parse(model1, '#vis1');
    Nyaplot.core.parse(model2, '#vis2');
};
</script>
</body>
</html>