hvplot icon indicating copy to clipboard operation
hvplot copied to clipboard

Add easy to use, customizable theming with a great look and feel

Open MarcSkovMadsen opened this issue 1 year ago • 6 comments

Adds easy to use, customizable theming to hvPlot. Should work for HoloViews as well and integrate well with Panel.

For example like

hvplot.extension(theme=THEME, color=COLOR, cmap=CMAP, font=FONT)

This PR was requested by @philippjfr . I should initiate and @philippjfr would look at finding solutions for the HoloViews/ Bokeh related technical issues.

  • How to style tooltips and toolbar. This requires css and I cannot see any Bokeh/ hvPlot way to inject this.
    • I think the Bokeh Theme should provide a css argument that can be used?
  • How to implement working autohide toolbar as there is some bug currently according to Philipp.
  • How to properly implement what is currently in hooks
  • How to properly set defaults like color and cmap across all kinds of plots.

Maybe @matpap has suggestions for solving these issues?

This PR is about getting the basics right

  • Theme api that extends to all plotting backends and multiple themes
  • Theme that works well for default the Bokeh backend

I think we should not wait for Bokeh 3.0 to solve some of these issues. But one day it would be nice to get the improvements ported back to Bokeh.

Closes #841, Closes #834 Related #537

Examples

panel serve examples/user_guide/theming_bokeh.py --auto

fast theme

image

fast-dark theme

image

MarcSkovMadsen avatar Aug 31 '22 05:08 MarcSkovMadsen

I will wait for Philipps feedback/ solutions for the issues listed above.

MarcSkovMadsen avatar Aug 31 '22 05:08 MarcSkovMadsen

Is that a screenshot from a full-screen plot on a large monitor? The tick labels seem much too small, but maybe if it were on a laptop screen they would be ok?

jbednar avatar Sep 02 '22 15:09 jbednar

Big screen

MarcSkovMadsen avatar Sep 02 '22 15:09 MarcSkovMadsen

I remember using the theme like: hv.renderer("bokeh").theme = "dark_minimal"

Does .opts(theme="dark_minimal") work, or is this separate?

Would this work for matplotlib too?

Also, should the theme be integrated on panel rather than hvplot?

I personally like streamlit's widget theme/style; feels very "modern/minimal"

Perhaps the colors of the theme should reflect panel's green logo?

ahuang11 avatar Sep 03 '22 04:09 ahuang11

Thanks @MarcSkovMadsen for this effort. I agree it'd be nice to have an easy way to customize the theme. However I wouldn't know where to start reviewing this, it seems like you're creating a new hvplot_extension function while there's already an existing one. There's also a lot of TODOs in the code. If this is still work in progress could you please mark it as WIP?

maximlt avatar Oct 11 '22 13:10 maximlt

I asked @MarcSkovMadsen to push something I could work from, so blame me 🙂

philippjfr avatar Oct 11 '22 13:10 philippjfr