New Dash Community Component: dashvis

Hello!

Inspired by visdcc, I have implemented & published a new Dash Component which does exactly the same thing - implements vis.js - but this time it implements the entire vis.js interface, as described in vis.js docs.

Here’s the project url: GitHub - lewkoo/dashvis: Dash Plotly implementation of vis.js library

Extensive usage examples, which cover all API calls, are provided too.

This project was implemented to gain access to all functionality of vis.js from Dash for our in-house project where we utilise vis.js.

I hope you’ll find it useful. This is my first time implementing a dash component or coding in React, so I am looking forward to any feedback, if you have the time.

Thanks!

3 Likes

Sounds great - do you have a link to dashvis?

Thanks, I forgot to include a link. I’ve added it to the original post.

Thank you for creating this component, @lewkoo . Congratulations on building your first Dash component. I added Dashvis to the growing list of community components :slight_smile:

@lewkoo This is intriguing.

As always, there are choices/options available, and one other option that I have historically thought of of when it comes to network/graph visualization in python, with Dash … is Dash Cytoscape (via cytoscape.js). (Noting further that in the javascript world choice extends even more broadly per options denoted in Graph Visualization Tools - Developer Guides)

I was wondering if you might have an opinion of why/when vis.js (and dashvis) vs other options.

thx in advance for any perspective.

Cystoscape is a great component and I have considered using it for our project. I have never gone to great lengths to understand the differences fully and I might assume cystoscope can potentially achieve everything that vis.js can (at least when it comes to pure JavaScript implementation)

Simply put, we already had a large python codebase without a UI, so I decided to build one using Dash. When the need to visualize our data as a hierarchical tree arose, I saw visdcc component and build a quick prototype around it. That’s how I ended up using vis.js - but, honestly, could have been any one of the libraries that are mentioned in the link you’ve provided.

However, visdcc as a component did not fully implement vis.js, hence I decided to make a full implementation.

So far I have only implemented the Network part of vis.js - there are other “parts” of that library that I might have to implement, particularly the Data Table part (and yes, I am aware that Dash has a DataTable component, but it lacks some features I need).

Sorry, I really wish I had a better, more detailed answer for you. But this is what I have got :grinning:

1 Like

Thank you!

all good @lewkoo … many thanks for the context … there are always multiple options to achieve objective, and you taking initiative via dashvis to implement the full range of vis.js increases such optionality within python with Dash.

On the datatable side of things, (caution: advertising alert!) if there’s ever interest in our enterprise offering, we do license a Dash enabled version of Ag-Grid (Dash Ag-Grid | Dash for Python Documentation | Plotly) which is profiled as “The Best Javascript Table in the world” per https://www.ag-grid.com/ :slight_smile:

For those passing through, the demo apps are pretty cool. This is the usage.py:
dashvis3


change the data structure in the editor and see it being updated live in the graph

dashvis2

5 Likes