Generating Static HTML Dashboard Using Plotly Python API - Controlling Element Layout - python-3.x

I'm looking at the gorgeous and powerful Plotly Python API with the goal of generating a static html dashboard.
This raises two questions:
For generating html, I see the following example. It appears the charts are embedded via a URL. Does this URL embedding implementation still apply since plotly has gone open source? Are there now other methods for sending plotly plots to static html?
How does one control the layout of the plots/dashboard elements? In Bokeh, for example we could do something like:
bar = Bar(<define bar plot>)
line = Line(<define line plot>)
donut = Donut(<define donut chart>)
bar_line_panel = hplot(bar, line)
final_layout = vplot(bar_line_panel, donut)
output_file('foo.html')
show(final_layout)
The rendered html file would contain the line and bar plots next to each other above the donut chart. Is there similar functionality in plotly, or are templates and html/css wrangling required to specify layout for plot elements like in this example?
Thank you for your time, very much looking forward to creating some interactive visualizations in Plotly!

Related

How to draw custom shapes with draw2d?

I am using draw2d javascript library for drawing predefined shapes and custom shapes in it's canvas.
As I don't have any example made yet, I am trying to copy from it's documentation but doesn't seem to find a good way to research it as it contains a whole lot of it.
Here is the circle example.
http://www.draw2d.org/draw2d_touch/jsdoc_6/#!/api/draw2d.shape.basic.Circle
and here are some more documentation with examples.
http://www.draw2d.org/draw2d_touch/jsdoc_6/
I have premade shapes with html and css and I am trying to drag and drop and render them on canvas like these in this image. Also when dropped, they should have input and output ports too.
Is it possible to convert this html/css to draw2d shapes?
So here this is made possible via extending draw2d's SVGFigure and thus we have ability to provide custom svg to render it as a custom shape.
Below links were useful in this context.
http://www.draw2d.org/draw2d_touch/jsdoc/#!/guide/extending_svg_figure-section-live-example
https://github.com/freegroup/draw2d/tree/master/examples/shape_custom_svg
http://www.draw2d.org/draw2d_touch/jsdoc_6/#!/api/draw2d.SetFigure
https://github.com/freegroup/draw2d/tree/master/examples/shape_labeld
https://github.com/freegroup/draw2d/tree/master/examples/shape_custom_markdown

How to find xpath of js rendered element for puppeteer

Im trying to interact with a js rendered page. Essentially this is a free widget from tradingview; however, the color of the lines is not something I can change. (yes there is an override, however, it only affects 1 line) I need to be able to change 2 lines.
Trading View Advanced Chart Widget Constructor
Can anyone tell me if this is possible with a puppeteer? How can I get XPath for an element which is generated by JS? View source and developer tools do not provide any xpaths to the elements.

AlloyUI: how to customize DiagramNode with no icons but multiple labels or attributes to be shown

I am building a simple flow chart editor using AlloyUI, following this example, and I want to customize it more, in a way that there is no icon but names and attributes can be shown together in a svg container. If there is any similar example, or any suggestions of doing this?

Embed JavaScript/SVG data visualizations in Octopress post with proper alignment?

In a post on my Octopress blog, I'm trying to embed some basic data visualizations I developed using D3.js. I understand how to add a script to a post (this question and this one cover that well enough), so I'm able to display the visualizations.
My problem is the alignment of the visualizations--they appear at the very bottom of the blog, outside the post itself (I'd include a screenshot, but I don't have enough reputation points to share images). When I inspect the HTML elements, I see that the two visualizations are SVG elements (as they should be) at the bottom, separate from div#content and div.entry-content (where the rest of the post content appears), and later than the footer and sidebar.
Is there a simple way to embed these visualizations on Octopress?

Getting coordinate / shape data from pydot for layout in PyQt4

I would like to use the QGraphicsView control and QGraphicsScene to layout GraphViz generated graphs using pydot. Is there a way to generate the graph in pydot, have GraphViz do the layout, and then extract the layout information (such as is included in the various output formats generated by pydot.write_xyz)? So far in my testing the get_pos() functions for Nodes, etc. return None.
As you already said, you have to first output the graph with create_dot to a string, then generate the graph layout by passing that string to graph_from_dot_data:
graphWithPositions = pydot.graph_from_dot_data(graph.create_dot())

Resources