4

On this page you can enter a set of cypher queries and get a visualization of the graph as it exists through those queries. What plugin are they using to create this visualization? Is there an easy way to get this same widget in a stand-alone way? I know the console that comes with neo4j has some visualization, but you have to go through the console to gain such a visualization. In looking at the linked page, I would think I could render a page or a frame that only contains the visualization and not have to rely on this page or a manual entry of queries.

WildBill
  • 9,143
  • 15
  • 63
  • 87
  • Take a look at http://d3js.org/. – mayr Oct 21 '14 at 08:39
  • I know d3 will visualize graphs, but how how do you use it in the way they did on that page? I found this link http://maxdemarzi.com/2012/02/13/visualizing-a-network-with-cypher/#more-533 , but I'm unsure how applicable it is as neo4j has changed a bot since 2012... – WildBill Oct 22 '14 at 01:01

1 Answers1

0

This is the list of the used JS scripts and CSS:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/d3/3.2.2/d3.min.js"></script>
<script type="text/javascript" src="console_assets/javascripts/visualization.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/codemirror/2.36.0/codemirror.min.js"></script>
<script type="text/javascript" src="console_assets/javascripts/cypher.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/codemirror/2.36.0/formatting.min.js"></script>
<script type="text/javascript" src="console_assets/javascripts/runmode.js"></script>
<script type="text/javascript" src="console_assets/javascripts/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="console_assets/javascripts/cypher.datatable.js"></script>
<script type="text/javascript" src="console_assets/javascripts/console.js"></script>
<style type="text/css">
    @import url("console_assets/stylesheets/main.css");
    @import url("console_assets/stylesheets/highlight.css");
    @import url("console_assets/stylesheets/d3.css");
    @import url("console_assets/stylesheets/light.css");
    @import url("console_assets/stylesheets/datatable.css");
</style>

I guess it will be faster for you to adopt http://d3js.org from scratch than to try to mimic the exact same way of visualization.

Also some of the code is not explicitly licensed for free usage, so ... licensing implications are possible.

It is better to think twice before using some code with unclear licensing rights.
You can trust me on this - I learned it the hard way! :(

Antoan Milkov
  • 2,152
  • 17
  • 30