Bokeh html output_file- change html and body css

Community Support
1

How can I change the style tags in the html files for plots?

For example this plot:

from bokeh.plotting import figure, output_file, show

output_file("line.html")

p = figure(plot_width=400, plot_height=400)

# add a line renderer
p.line([1, 2, 3, 4, 5], [6, 7, 2, 4, 5], line_width=2)

show(p)

Has this style tag:-

html { width: 100%; height: 100%; } body { width: 90%; height: 100%; margin: auto; }

``

So how can I change the margin from auto to 0 or anything else?

Thanks.

2

Hi,

You will probably want to use file_html directly, instead of show:

  http://bokeh.pydata.org/en/latest/docs/reference/embed.html#bokeh.embed.file_html

Here is an example that uses it:

  https://github.com/bokeh/bokeh/blob/master/examples/plotting/file/css_classes.py

Thanks,

Bryan

···

On Jan 6, 2017, at 11:24 AM, Siddhant Patel <[email protected]> wrote:

How can I change the style tags in the html files for plots?

For example this plot:
from bokeh.plotting import figure, output_file, show

output_file("line.html")

p = figure(plot_width=400, plot_height=400)

# add a line renderer
p.line([1, 2, 3, 4, 5], [6, 7, 2, 4, 5], line_width=2)

show(p)

Has this style tag:-
<style>
html {
width: 100%;
height: 100%;
}
body {
width: 90%;
height: 100%;
margin: auto;
}
</style>

So how can I change the margin from auto to 0 or anything else?

Thanks.

--
You received this message because you are subscribed to the Google Groups "Bokeh Discussion - Public" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [email protected].
To post to this group, send email to [email protected].
To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/504d06ba-8309-4c8a-85c9-6a5049c9099b%40continuum.io\.
For more options, visit https://groups.google.com/a/continuum.io/d/optout\.

3

Thanks for the reply Bryan. Running that code gives me this error-
AttributeError: unexpected attribute ‘css_classes’ to Div, possible attributes are disabled, height, name, render_as_text, sizing_mode, tags, text or width

``

Is there a new method to assign css classes?

Thanks, Sid

···

On Saturday, January 7, 2017 at 12:44:05 AM UTC+5:30, Bryan Van de ven wrote:

Hi,

You will probably want to use file_html directly, instead of show:

    [http://bokeh.pydata.org/en/latest/docs/reference/embed.html#bokeh.embed.file_html](http://bokeh.pydata.org/en/latest/docs/reference/embed.html#bokeh.embed.file_html)

Here is an example that uses it:

    [https://github.com/bokeh/bokeh/blob/master/examples/plotting/file/css_classes.py](https://github.com/bokeh/bokeh/blob/master/examples/plotting/file/css_classes.py)

Thanks,

Bryan

On Jan 6, 2017, at 11:24 AM, Siddhant Patel [email protected] wrote:

How can I change the style tags in the html files for plots?

For example this plot:

from bokeh.plotting import figure, output_file, show

output_file(“line.html”)

p = figure(plot_width=400, plot_height=400)

add a line renderer

p.line([1, 2, 3, 4, 5], [6, 7, 2, 4, 5], line_width=2)

show(p)

Has this style tag:-

html {

width: 100%;

height: 100%;

}

body {

width: 90%;

height: 100%;

margin: auto;

}

So how can I change the margin from auto to 0 or anything else?

Thanks.

–
You received this message because you are subscribed to the Google Groups “Bokeh Discussion - Public” group.

To unsubscribe from this group and stop receiving emails from it, send an email to [email protected].

To post to this group, send email to [email protected].

To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/504d06ba-8309-4c8a-85c9-6a5049c9099b%40continuum.io.

For more options, visit https://groups.google.com/a/continuum.io/d/optout.

4

Apologies, that example has a new feature. You will need to run 0.12.4rc1, or wait until Monday for the 0.12.4 release, or comment out the parts about "css_classes" which are not directly related to your question (I suggested it as a way to demonstrate file_html and a custom template)

Bryan

···

On Jan 6, 2017, at 2:22 PM, Siddhant Patel <[email protected]> wrote:

Thanks for the reply Bryan. Running that code gives me this error-
AttributeError: unexpected attribute 'css_classes' to Div, possible attributes are disabled, height, name, render_as_text, sizing_mode, tags, text or width

Is there a new method to assign css classes?

Thanks, Sid

On Saturday, January 7, 2017 at 12:44:05 AM UTC+5:30, Bryan Van de ven wrote:
Hi,

You will probably want to use file_html directly, instead of show:

        http://bokeh.pydata.org/en/latest/docs/reference/embed.html#bokeh.embed.file_html

Here is an example that uses it:

        https://github.com/bokeh/bokeh/blob/master/examples/plotting/file/css_classes.py

Thanks,

Bryan

> On Jan 6, 2017, at 11:24 AM, Siddhant Patel <[email protected]> wrote:
>
> How can I change the style tags in the html files for plots?
>
> For example this plot:
> from bokeh.plotting import figure, output_file, show
>
>
>
> output_file("line.html")
>
>
>
> p = figure(plot_width=400, plot_height=400)
>
>
>
> # add a line renderer
> p.line([1, 2, 3, 4, 5], [6, 7, 2, 4, 5], line_width=2)
>
>
>
> show(p)
>
> Has this style tag:-
> <style>
> html {
> width: 100%;
> height: 100%;
> }
> body {
> width: 90%;
> height: 100%;
> margin: auto;
> }
> </style>
>
> So how can I change the margin from auto to 0 or anything else?
>
> Thanks.
>
> --
> You received this message because you are subscribed to the Google Groups "Bokeh Discussion - Public" group.
> To unsubscribe from this group and stop receiving emails from it, send an email to bokeh+un...@continuum.io.
> To post to this group, send email to bo...@continuum.io.
> To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/504d06ba-8309-4c8a-85c9-6a5049c9099b%40continuum.io\.
> For more options, visit https://groups.google.com/a/continuum.io/d/optout\.

--
You received this message because you are subscribed to the Google Groups "Bokeh Discussion - Public" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [email protected].
To post to this group, send email to [email protected].
To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/f0e3d498-7968-416d-b876-b908e40fd399%40continuum.io\.
For more options, visit https://groups.google.com/a/continuum.io/d/optout\.

5

Or you can also look at the old version of that example on the 0.12.3 tag on GitHub

···

On Jan 6, 2017, at 2:25 PM, Bryan Van de Ven <[email protected]> wrote:

Apologies, that example has a new feature. You will need to run 0.12.4rc1, or wait until Monday for the 0.12.4 release, or comment out the parts about "css_classes" which are not directly related to your question (I suggested it as a way to demonstrate file_html and a custom template)

Bryan

On Jan 6, 2017, at 2:22 PM, Siddhant Patel <[email protected]> wrote:

Thanks for the reply Bryan. Running that code gives me this error-
AttributeError: unexpected attribute 'css_classes' to Div, possible attributes are disabled, height, name, render_as_text, sizing_mode, tags, text or width

Is there a new method to assign css classes?

Thanks, Sid

On Saturday, January 7, 2017 at 12:44:05 AM UTC+5:30, Bryan Van de ven wrote:
Hi,

You will probably want to use file_html directly, instead of show:

       http://bokeh.pydata.org/en/latest/docs/reference/embed.html#bokeh.embed.file_html

Here is an example that uses it:

       https://github.com/bokeh/bokeh/blob/master/examples/plotting/file/css_classes.py

Thanks,

Bryan

On Jan 6, 2017, at 11:24 AM, Siddhant Patel <[email protected]> wrote:

How can I change the style tags in the html files for plots?

For example this plot:
from bokeh.plotting import figure, output_file, show

output_file("line.html")

p = figure(plot_width=400, plot_height=400)

# add a line renderer
p.line([1, 2, 3, 4, 5], [6, 7, 2, 4, 5], line_width=2)

show(p)

Has this style tag:-
<style>
html {
width: 100%;
height: 100%;
}
body {
width: 90%;
height: 100%;
margin: auto;
}
</style>

So how can I change the margin from auto to 0 or anything else?

Thanks.

--
You received this message because you are subscribed to the Google Groups "Bokeh Discussion - Public" group.
To unsubscribe from this group and stop receiving emails from it, send an email to bokeh+un...@continuum.io.
To post to this group, send email to bo...@continuum.io.
To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/504d06ba-8309-4c8a-85c9-6a5049c9099b%40continuum.io\.
For more options, visit https://groups.google.com/a/continuum.io/d/optout\.

--
You received this message because you are subscribed to the Google Groups "Bokeh Discussion - Public" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [email protected].
To post to this group, send email to [email protected].
To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/f0e3d498-7968-416d-b876-b908e40fd399%40continuum.io\.
For more options, visit https://groups.google.com/a/continuum.io/d/optout\.

6

Wow new version on Monday!! will wait till then :slight_smile:

···

On Saturday, January 7, 2017 at 1:57:09 AM UTC+5:30, Bryan Van de ven wrote:

Or you can also look at the old version of that example on the 0.12.3 tag on GitHub

On Jan 6, 2017, at 2:25 PM, Bryan Van de Ven [email protected] wrote:

Apologies, that example has a new feature. You will need to run 0.12.4rc1, or wait until Monday for the 0.12.4 release, or comment out the parts about “css_classes” which are not directly related to your question (I suggested it as a way to demonstrate file_html and a custom template)

Bryan

On Jan 6, 2017, at 2:22 PM, Siddhant Patel [email protected] wrote:

Thanks for the reply Bryan. Running that code gives me this error-

AttributeError: unexpected attribute ‘css_classes’ to Div, possible attributes are disabled, height, name, render_as_text, sizing_mode, tags, text or width

Is there a new method to assign css classes?

Thanks, Sid

On Saturday, January 7, 2017 at 12:44:05 AM UTC+5:30, Bryan Van de ven wrote:

Hi,

You will probably want to use file_html directly, instead of show:

   [http://bokeh.pydata.org/en/latest/docs/reference/embed.html#bokeh.embed.file_html](http://bokeh.pydata.org/en/latest/docs/reference/embed.html#bokeh.embed.file_html)

Here is an example that uses it:

   [https://github.com/bokeh/bokeh/blob/master/examples/plotting/file/css_classes.py](https://github.com/bokeh/bokeh/blob/master/examples/plotting/file/css_classes.py)

Thanks,

Bryan

On Jan 6, 2017, at 11:24 AM, Siddhant Patel [email protected] wrote:

How can I change the style tags in the html files for plots?

For example this plot:
from bokeh.plotting import figure, output_file, show

output_file(“line.html”)

p = figure(plot_width=400, plot_height=400)

add a line renderer

p.line([1, 2, 3, 4, 5], [6, 7, 2, 4, 5], line_width=2)

show(p)

Has this style tag:-

html { width: 100%; height: 100%; } body { width: 90%; height: 100%; margin: auto; }

So how can I change the margin from auto to 0 or anything else?

Thanks.

–
You received this message because you are subscribed to the Google Groups “Bokeh Discussion - Public” group.
To unsubscribe from this group and stop receiving emails from it, send an email to [email protected].
To post to this group, send email to [email protected].
To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/504d06ba-8309-4c8a-85c9-6a5049c9099b%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.

–
You received this message because you are subscribed to the Google Groups “Bokeh Discussion - Public” group.

To unsubscribe from this group and stop receiving emails from it, send an email to [email protected].

To post to this group, send email to [email protected].

To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/f0e3d498-7968-416d-b876-b908e40fd399%40continuum.io.

For more options, visit https://groups.google.com/a/continuum.io/d/optout.