I decided to copy the content of this repo back into the OntoEngine repo and keep working on it there.

graph-query-visualizer

Build a SPARQL query by constructing a visual graph and vice versa. I moved this out of my OntoEngine coding project to make it also useful independent of it.

📺 Demo from 18:24 in the 42min presentation video of the OntoEngine project.

Tech stack

• force-graph for the graph visualization
• Yasgui for the SPARQL editor
• SPARQL.js for parsing and generating the SPARQL query

Usage

Setup this repo for development

npm install

npm run build creates the bundle.js (via webpack) in dist/ which is used by example/index.html

Use this as dependency in your project

I developed this for usage in HTML. I might see later how to make it useful as import and require.

npm i --save graph-query-visualizer

Import bundle.js and yasgui.min.css into your .html file:

<script src="./node_modules/graph-query-visualizer/dist/bundle.js"></script>
<link href="./node_modules/graph-query-visualizer/dist/yasgui.min.css" rel="stylesheet" />