Package Exports
- jsonld-vis
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (jsonld-vis) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
JSON-LD visualization
Turn JSON-LD into pretty graphs
Usage
See the examples/ folder for usage details.
Import jsonld-vis.js and jsonld-vis.css. Be sure to include the dependencies d3 and d3-tip.
To initialize, simply load data into the jsonldVis function:
d3.json('example.json', function(err, data) {
if (err) return console.warn(err);
d3.jsonldVis(data, '#graph', { w: 800, h: 600, maxLabelWidth: 250 });
});d3.jsonldVis(data, querySelector[, config])
Where the optional config variable is as follows:
{
h: 600, // height
w: 800, // width
maxLabelWidth: 250, // maximum label width
transitionDuration: 750, // transition duration, in ms
transitionEase: 'cubic-in-out', // transition easing function
radius: 5 // minimum node radius
}Specifying the width is just for initialization purposes. The width of the svg element will dynamically be adjusted as necessary.
Labels that are longer than maximum label width are truncated - hover over the node to see the full label:
