As I understand it, Bokeh looks to provide for Python, similar capability that D3.js provides for JavaScript. Some advantages for Bokeh I can see include the use of HTML Canvas (so we can render more to the browser), Abstract Rendering and a lower barrier to entry for people familiar with Python over JavaScript but wanting to develop interactive browser based visualisations.
This is great but, where do you go (i.e. as a developer) to extend Bokeh to match the flexibility offered by D3 e.g. to add Chord diagrams, Network graphs or develop more novel visualisations such as those demonstrated at IEEE VIS or the VAST challenge?
Does the Bokeh project have aspirations to become as fully featured as D3 (appreciate D3 has been around for a while now)?
They do want to be fully featured as D3:
Its goal is to provide elegant, concise construction of novel graphics in the style of D3.js, and to extend this capability with high-performance interactivity over very large or streaming datasets. Bokeh can help anyone who would like to quickly and easily create interactive plots, dashboards, and data applications.
This is detailed in their technical vision page.
To help extend Bokeh, check the extending Bokeh page and the example of wrapping a JS library (visjs). There is also a developer guide and a enhancement proposal document.
It would be awesome to have something like D3's transitions!
Related
i need a javascript plugin can design an dynamic IVR diagram and in output can get object for pass to server side.
i found mxgraph but not for IVR.
Here is a sample IVR app: https://gojs.net/latest/samples/IVRtree.html
Call diagram.model.toJson() to save it as JSON-formatted text.
I don't see why mxGraph would not work for this kind of task. In fact any reasonable graph drawing library should be able to able to do that.
I know for sure that you can easily implement great looking IVR diagrams (which are mostly just simple trees with a possibly dynamic automatic layout and a custom visualization for the nodes) with yFiles for HTML. That library has been created specifically to be highly extensible and as such allows for easily adding your own specific visualization for nodes and edges. Also trees and "near-tree" can easily be laid out automatically and you can create a dynamic interactive visualization of such a tree like in this decision tree demo.
Disclaimer: I work for the company that creates the latter of the above mentioned libraries, but I do not represent my employer on SO.
There are many libraries available for IVR diagrams. You can use d3.js, Gojs and JointJs.
I suppose to develop a network management REST client with topology diagram (as an image showing below). With that application, the user should able to create a topology diagram by drag and drop, change the nodes positions by dragging, edit nodes properties and delete node elements.
Now I'm doing some feasibility study how can I approach this task with HTML 5 client or Java thick client. I have seen some API called esri but it is commercialised.
I have planned to develop this application Angularjs or JavaFX. But none of them has inbuild libraries for it (I'm more preferring to develop this client application with AngularJs). Could you please help me to find any JavaScript frameworks or Java libraries available for accomplishing this task (then I can integrate them with AngularJs or JavaFX).
I have seen similar kind of question at StackOverflow, it was too old but now it can be available new frameworks.
Thanks
We can be accomplishing this task with some HTML 5 related UI frameworks which can visualize interactive graphs (user can create, update, read, and delete the graph elements). Some of them are as follow,
GoJS
GoJS is a feature-rich JavaScript library for implementing custom interactive diagrams and complex visualizations across modern web browsers and platforms.
The library makes constructing JavaScript diagrams of complex nodes, links, and groups easy with customizable templates and layouts.
Commercial license.
source: https://gojs.net/latest/extensions/SnapLinkReshaping.html
JointJS
JointJS is a modern HTML 5 JavaScript library for visualization and interaction with diagrams and graphs.
It can be used to create either static diagrams or, and more importantly, fully interactive diagramming tools such as workflow editors,
process management tools, IVR systems, API integrators, presentational applications and more. Licensed under both Open Source license (fewer features) and Commercial license (more features).
source: https://resources.jointjs.com/demos/kitchensink
mxGraph
mxGraph is a JavaScript diagramming library that enables interactive graph and charting applications to be quickly created that run natively in any major browser.
Under the Apache license 2.0 (free and open source).
Support for JavaScript, Java, .NET, and PHP.
1) mxDraw
source: https://jgraph.github.io/mxgraph/javascript/examples/editors/diagrameditor.html
2) Graph Editor
source: https://jgraph.github.io/mxgraph/javascript/examples/grapheditor/www/index.html
vis.js
vis.js is a dynamic, browser-based visualization library.
The library is designed to be easy to use, to handle large amounts of dynamic data, and to enable manipulation of and interaction with the data.
Licensed under both Apache 2.0 (free and open source) and MIT (open source license).
source: vis.js library
D3.js
D3.js is a JavaScript library for manipulating documents based on data.
D3 brings data to life using HTML, SVG, and CSS. D3’s emphasis on web standards gives you the full capabilities of modern browsers,
combining powerful visualization components and a data-driven approach to DOM manipulation.
Under the BSD license (open source initiative).
source: http://bl.ocks.org/rkirsling/5001347
Conclusion
According to the features of GoJS, it is the most convenient framework for visualizing interactive graphs,
because UI can customize easily and can save the Diagram Model as JSON format.
But this is under the commercial license ($2995 per developer).
JointJS provides fewer features with their open source license version,
therefore needs to purchase the commercial version for fulfilling our requirements.
It may be difficult to customize their complex UI.
D3.js is more user-friendly but we have to proceed more effort to fine-tune it according to our requirements such as,
proceed the node creation via a tool icon, enable the user to customize the node’s caption value, remove some existing visual effects, etc.
Needs to explore about the saving format (JSON, XML, TXT, etc.) of Diagram Model.
According to my conclusion, we can choose either mxGraph or vis.js JavaScript library for our developments.
mxGraph: It seems we can easily customize the ‘mxDraw’ (web 2.0-style diagram editor) drawing application and reuse it.
‘Graph Editor’ diagram editor application is more advanced and it may take more time to customize it and needs to explore about the Diagram Model saving format.
vis.js: Is more user-friendly than ‘mxGraph’ but we may have to spend some development effort for exploring about Diagram Model saving format and removing existing visual effects.
I want to visualize a Neo4j database in a graphical application. (I'm doing this primarily as a learning exercise).
I want it to behave almost identically to the visualization in Neo4j's WebAdmin: When the graphic appears, I want to see the nodes moving around as they settle into their final locations, and I want the user to be able to click and drag node icons around the screen and have them stick where they are dropped, with the rest of the graph adjusting to account for the change.
I have two questions.
What are the technical terms for the three requirements crudely described in the paragraph above?
I'm a Java programmer with no experience in JavaScript, but I'm thinking that, with this project, it's time to get some - sigma.js in particular seems very powerful and relatively simple. However, ultimately this needs to be done within a Java Swing application, and while I know there are various containers I can use to embed JS/HTML content into Swing, still it seems that a pure Java solution would be ideal, and I'm curious about any frameworks that might make this possible. I'm looking into Gephi now, but it doesn't seem anywhere near as powerful or as simple to use as sigma.js. Am I wrong in this assumption?
To summarize the second question: Which would be the better investment of my time: Learning sigma.js and the various JS frameworks (which will require me to get comfortable with JS in general), or learning to use Gephi in Java? (assuming I have a general and long-term interest in graph visualization)
Java visualization
Gephi does provide a toolkit for Java and Python which doesn't contains the UI modules, so unless you want to use Gephi itself to visualise your network you cannot embed its UI in your Java/Swing application as long as I know.
The toolkit contains all the algorithms and plugin infrastructure so if you want to use some of their analysis tool embedded in your app you can use that, otherwise I don't think it's your case.
There are other Java options if you want for graph visualisation here: Java graph library for dynamic visualisation
About Gephi and sigmaJS
IMHO Gephi is far more powerful than sigma.js: it has full SNA tools, multiple layouts, a data editor, exporters, plugin-systems...
One important factor is also the size of the dataset you want to visualise: while sigmaJS can handle up to 500 nodes in the view, Gephi can layout easily 50000 nodes with GPU support as well.
Gephi is a scientific tool made for people that don't want to code to visualise a network and it does it's job. SigmaJS is one of many JS solutions to visualise graphs on a web page.
You can always export to sigmaJS from Gephi with a plugin.
What's better?
At the end of the story I guess the tool you are going to use will depends on:
do you have to visualise a big dataset? -> Java solutions will win for big ones
do you need to distribute it easily? -> Web app / SigmaJS wins for distributed
do you want to have a full integration with your app? -> Java wins
The best one I've found is Keylines, but its not cheap.
Gephi is OK, but the last time I looked it did not support Neo4j 2.0
If your a programmer Neo4j is open source, so you can fork the repository on Git and use that (you will have to check the licencing model before you commercialise any product though)
I intend to use one of D3 or Dojo GFX to create some big data visuals like TreeMap, Wave-forms etc. The great thing about D3 is that many of these visualizations are already available as example implementations for fast development. Also its enter-update-exit paradigm fits nicely with my dataset. But I am not averse to using Dojo GFX (and writing my own Treemap etc implementations) if it is said to be more stable and better suited for mobile.
Seeking suggestions and comparisons...
In short, the answer is simple: If you are using dojo, use the GFX module. If you are not using dojo, use D3.
What's more, GFX and D3 are effectively the same thing: low level drawing APIs (herein visualization toolkits), both of which can be used in tandem with a larger javascript framework. GFX, in fact, must be used within dojo.
Since graphing/charting/drawing/whatever is often only part of a web application, the underlying framework architecture should be the driving force behind choosing a visualization toolkit. So basically, if you go dojo or not is what will answer this question for you, and if you do, GFX is a great option since it is already baked in (though I should mention that D3 can be wrapped in an AMD as referenced here).
And now, a real answer
If you have decided that the visualization toolkit is the driving force behind choosing a javascript framework and not the other way around, here are some thoughts on GFX vs D3:
Community Support: More people are developing and asking questions on D3. Looking at github watches/stars/forks, D3 leads with 1.9k/22.7k/4.7k over GFX's 54/52/91 (dojox is GFX's parent module). Here on stackoverflow D3 has nearly 7k tags compared to GFX's 26.
Features: GFX can render using SVG, VML, canvas, and even silverlight. By this, GFX has superior cross platform, browser, and version support. Beyond this, both visualization toolkits enjoy the same access to every feature you get when writing visualizations declaratively.
Learning Curve: Both toolkits are very low level APIs that are complicated to learn. D3's enter-update-exit pattern may be especially confusing for those not familiar with extensive method chaining.
Frameworks: Both of these visualization toolkits are used in larger charting frameworks. GFX is used by Dojo Charting, D3 is used by many including NVD3, D3plus, and Vega to name a few.
I am looking for a charts library to be displayed on a website. I will use intensively this library (for area, line and bar charts mainly), so I prefer to secure my choice before starting implementing.
The list of website chart libraries that I have initially considered are:
Plotkit
Emprise JS Charts
Sparkline
Protochart
gRaphael
Bluff
YUI Charts:
However after some researches on this forum and investigations on the web, I have reduced my candidate list to these two libraries:
Flot jQuery plugin
Google Visualization
Which one do you advise me to use and why (if you have worked with one or two of them, please tell me your feedback)?
How do they compare one to each other regarding ease of use, performance and features?
Thank you
EDIT: Based-Flash Chart libraries were not eligible with my constraints
I will try to answer my own question after some several tries and researches about these 2 visualization libraries, here are my own list of pros for each solution :
Flot Pros
jQuery plugin : if you are familiar with jQuery (or if your apps is integrated with jQuery), it seems natural to use Flot
Offline visualization : you can test or have it installed into an internal website. Google Visu can only work if you have acces to the google website !!
Customization : this is basically a JavaScript file so if you are good at JS coding, you can customize your charts as your convenience. Also the Flot plugin system allows you better modularity
Google Visualization Pros
Documentation : awesome ! Examples for each type of graphs are available in the Google site
Easy to use : Really. Easier than Flot (that requires to somehow customize the div container)
Powerful : you have many sorts of graphs and features (zooming, interactivity,...)
Java and Python API : it can helps a lot for constructing the Data Table (at least for me, I can use the Java API)
Bottom Line
If you are familiar with jQuery, go with Flot. If you need for some reasons to see your charts offline, go with Flot. If you want full control, go with Flot.
If you don't recognize yourself above, go with Google Visu. It's easy to learn and implement, very well documented and extremely powerful.
Not in your list, but I would recommend you have a look at Highcharts http://www.highcharts.com/
Highcharts is SVG, and as such, it is much more dynamic than Flot, you can restyle graphs with CSS, attach events, perform animations, etc...
It is also compatible with IE6 and it works server-side (thx to Batik)
I'm currently building a graph-intensive application, and chose Highcharts after lots of benchmarkings. I don't regret my choice.
The piwik project uses the Open Flash Chart (not on your list).
It's easy to use, has plenty of working examples very user friendly.
I am a user of Flot, and a big fan. I use it in a Grails application, and use stacked bar, line, and pie charts, including time-series and a bunch of interactive capabilities (i.e. turn off / on series with checkboxes, etc).
I found it to be a pleasure to work with overall, and feel the API is quite well developed (I saw that a bunch of other JS charting libraries adopted the API, so you'll even have some flexibility to move to another kit in the future). From looking at the google API just now for a minute, I think I like flot's better (although google may have ability to pass in a series as well, didn't see it from samples).
They just came out with a new version a few weeks ago (0.6), that supports plugins, which I expect will stimulate more innovation.
So I think part of this depends on other technologies you are planning to use. It seems like Visualization is integrated with GWT, so if you are thinking of using that, Visualization is the way to go. On the other hand, if you are thinking of using JQuery for AJAX, then Flot might be a more natural fit.
When I was making my decision to use this, it seems like Google didn't have interactive visualizations, only google charts (images), which is one of the reasons I went with Flot.
There is jqPlot (http://www.jqplot.com/), an open source project which looks good. Based on jQuery as well. I will give jqPlot a try, jQuery flot seems to be inactive.
Not in your list, but very impressive: ExtJS 4.0 charts