Embedding entire Bokeh app in Vue

Showcase
1

Hi,

I’ve been exploring the documentation and discourse looking for examples of how to embed an entire Bokeh app in a Vue app but didn’t find any so I am now sharing my implementation so that it may help others that are also interested in integrating Bokeh with Vue.

The Bokeh server is embedded in a Flask app. The frontend calls the corresponding endpoint that calls server_document to return a script that we then inject into the page. This script then injects another script that will replace the former with the entire Bokeh app and initiate a Websocket connection directly to the Bokeh server.

https://github.com/alexisagos/bokeh-vue

Let me know what you think ! Interested in knowing how others have integrated a Bokeh app in Vue.

Alexis

1 Like
2

Hi @Alexis ,

There’s always a lot of interest in embedding Bokeh apps in different frameworks, so this is really a valuable example. Thanks so much for sharing your work with us, and the Bokeh community! Is it okay if we mention it in a tweet? If so, do you have a Twitter handle we should tag?

4

Hi Carolyn,

Of course ! Feel free to mention this in a tweet, no need to tag me though, I’m not very active there.

Here’s a quick video showing the websocket in action:

1 Like
5

Hi @Alexis

Thanks for sharing. Why do you need to bring Flask into the mix? Could you not just connect Vue to the Tornado backend?

6

Hi Alexis,

This is really cool.

Btw I have a silly question, how did you a create a video of your dashboard. I too want to share some of my bokeh work but dont know how to create a video of my dashboard.

Thanks