Document layout with BokehJS

Community Support
1

Hello guys,

is there a way to control position of several plot models included in a single bokeh Document?

Like now, I can achieve that using two seperate Documents, which are embeded with

var doc1 = new Bokeh.Document();
var doc2 = new Bokeh.Document();

doc1.add_root(myplot1);
doc2.add_root(myplot2);

Bokeh.embed.add_document_standalone(doc1, target_div_1);
Bokeh.embed.add_document_standalone(doc2, target_div_2);

``

As far as I know, same comes with Plotting.show() and it is just a wrapper for the code above.

But in fact I need only one document with two plots, being capable of controlling their position (using embedding at a certain

tag).

Thank you in advance.

2

You can simply achieve this by using one single document:
var doc = new Bokeh.Document();
doc.add_root(plot1);
doc.add_root(plot2);
var div = document.getElementById(“plot”);
Bokeh.embed.add_document_standalone(doc, div);

``

Or you could use a grid:

var doc = new Bokeh.Document();
var grid = Bokeh.Plotting.gridplot([[plot1, plot2]])
doc.add_root(grid);
var div = document.getElementById(“plot”);
Bokeh.embed.add_document_standalone(doc, div);

``

Then you could position your HTML div element as you please, e.g.:

``

···

On Friday, January 11, 2019 at 10:23:36 AM UTC+1, Dan4e3 wrote:

Hello guys,

is there a way to control position of several plot models included in a single bokeh Document?

Like now, I can achieve that using two seperate Documents, which are embeded with

var doc1 = new Bokeh.Document();
var doc2 = new Bokeh.Document();

doc1.add_root(myplot1);
doc2.add_root(myplot2);

Bokeh.embed.add_document_standalone(doc1, target_div_1);
Bokeh.embed.add_document_standalone(doc2, target_div_2);

``

As far as I know, same comes with Plotting.show() and it is just a wrapper for the code above.

But in fact I need only one document with two plots, being capable of controlling their position (using embedding at a certain

tag).

Thank you in advance.