Adding hover tool to DataTable widget - python

using Bokeh 0.12.6 / Python 3.6:
Is there a way to add a hover tool (similar to bokeh.models.HoverTool for plots) on a bokeh.widgets.DataTable widget? It doesn't look like it's an api feature yet, so I'm looking for some guidance on the best way of achieving this?
Perhaps I can tinker with the final HTML document with Bokeh embedded inline and add a HoverTool javascript object associated with the SlickGrid table?

Related

Include Python / Bokeh plot in PowerPoint presentation preserving data pop-ups

If an EXCEL chart is pasted into a PowerPoint presentation as an EXCEL object, it is possible to hover the mouse over the line and see it's value. My boss likes this feature. I don't like having to do charts in EXCEL.
It is possible to get the same effect with bokeh or plotly, but as far as I am aware, that either relies on a stand-alone html file or a server instance.
Is it possible to paste a bokeh chart into a PowerPoint presentation preserving the feature that when you hover your mouse over a point, the value (and some other information) pops up?
Or is there another python solution that would allow this feature in PowerPoint (ppt is essential) while also allowing plots to be generated via code?
An available option is to create powerpoints with Plotly: https://towardsdatascience.com/embed-interactive-plots-in-your-slides-with-plotly-fde92a5865a and https://evidencen.com/how-to-embed-plotly-graphs-in-powerpoint/
Also it seems this question has been asked before and you can hyperlink the HTML source in the .pptx file: Output of Plotly in PowerPoint
yes. it's a hover tool. here is an example

Is it possible to get Dash-Cytoscape graph tooltips?

Here is an example cytoscape graph that I created using this site as reference here
I was wondering if its possible to show the tooltips when hovering on each node in a graph in the same way that plotly can do to its graphs (like this)
Dash Cytoscape does not have a built-in tooltip. It's possible to use hover callbacks (documented in the event callback guide) to update the content of a separate component (such as a html.P on the side). However that will not behave the same way as a tooltip.
You might also be able to build a custom component (using the component boilerplate) that follows your cursor and display custom information (given by the hoverData prop) whenever it is updated by a hover callback. However, that would require knowledge of JavaScript and React, which can be learned from the React for Python developers primer.

Is there a way to insert interactive animations from python plotly to a powerpoint?

I want to insert the plotly interactive animation into a powerpoint. I read online that you can generate a gif, however I want to be able to use the animation bar that you get from plotly on the powerpoint slide. Is there any way to do that? Sorry if this is a stupid question, this is my first time doing something like that.
You can try getting an extension that allows embedding the plotly webpage you have into powerpoint. How well this works will depend on the specifics of the extension you choose to use.
There is some discussion about embedding iframes into powerpoint here: https://answers.microsoft.com/en-us/msoffice/forum/all/how-do-i-embed-iframe-code-into-my-powerpoint/5b7b5bc9-a68b-46d9-88ad-207387d621b7

Is it possible to create elements using Bokeh widget DIV that respond to bokeh server commands?

I've been using Bokeh's datatable, but there are a few things I'd like to do that I don't know how to accomplish using the DataTable class. For example, I don't think it's possible add icons (or any images) to different rows, or setting the table to single selection only. So, I've been thinking about implementing just a HTML table, and writing it with the DIV widget.
However, I'd still like to add interactive features to the table, like buttons, or the icons mentioned above. Then, when an event is generated (e.g. onClick), that event is captured by the Bokeh server, and I can write the handlers in Python to do things such as modifying the data in ColumnDataSource, for example.
Is this possible? Or is there a better way to accomplish this?
Thanks!
I think the approprate way to achieve what you want is to create a custom widget:
Extending Bokeh Documentation
Custom Widget Example
I do not paste here the complete example because it is too long.

Plotly Dash API documentation

I recently started working on my very first dashboard application using dash.
The tutorials are comprehensible, however, I have a hard time handling the front end details because I cannot find an API reference. Specifically, each element accepts a style argument that let's us modify some CSS details, like text alignment, fonts etc. I have seen some examples in the tutorials but I would love to have an exhaustive list of everything I can pass there.
As an example, I want to create a table but the columns are too close together. I need to control the spacing between them and I imagine there should be an argument like padding, spacing, borderSize... you get the point. Where can I find these details?
It could be possible to edit some styling by passing some keywords to the Dash component. It depends on the component itself.
For example, if you are using DataTable from dash-table-experiment:
import dash_table_experiments as dt
help(dt.DataTable)
you can see that the API of this component allows you to set things like column_widths (list; optional) and min_width (number; optional).
If you need some more complex styling (e.g. a yellow background with linear gradient for all even table cells) I'm afraid you'll have to know some CSS.
A few additional resources:
Currently the Dash styleguide is based on the Skeleton CSS framework
Each dcc.Graph is composed by a figure and a layout. Here is the plotly.js figure reference
For things like showing/hiding legends, traces, etc, have a look at the plotly.js configuration options
For HTML: https://github.com/plotly/dash-html-components
For component: https://github.com/plotly/dash-core-components
Seems the dash project didn't create the user-friendly API document (I guess it was related to their business strategy).
The only way to get the help is the dash community and git-code project.
if you want help with python objects in dash then just use:
help(html.Div)
to get a list of argument parameters.
If you want to know what can be placed in the style parameter the answer is any and all css can be generated. You can customize the look anyway you want here is the syntax...
style={
'border':'1px solid #333',
'margin':'10px',
'padding':'10px',
'background-color':'#888',
'position':'absolute',
},
The style parameter excepts a dictionary object. In order for your CSS to be rendered it needs to be in the syntax above, which will create a python dictionary object.

Categories

Resources