vis.js

I am trying to draw a vis.js network diagram and have vis load and position the nodes. I then want the physics to be disabled so the nodes can be moved by the user. I have tried this but it is not working. var options = { nodes: { borderWidth:4, size:60, color: { border: '#222222', background: 'grey' }, font:{color:'black'} }, edges: { arrows: { to: {enabled: false, scaleFactor:1}, middle: {enabled: false, scaleFactor:1}, from: {enabled: false, scaleFactor:1} }, color: 'black' }, { physics: enabled: false; }; Has anyone done this? if so can you provide an example or advice on best way to

I am having a network graph of nodes and edges and would like to get the node data once it gets clicked. I currently have var network = new vis.Network(container, data, options); network.on( 'click', function(properties) { console.log('clicked node ' + properties.nodes); }); But this just gives me some internal id [105]. Is there a way to get the actual data that is associated with the node. The node ids that you get in the properties is not "some internal id", but these are the id's of the nodes that you defined yourself. You can simply read the node's data from your own DataSet with nodes

Is it possible to draw line graph on timeline, using visjs? I want to get something like here http://almende.github.io/chap-links-library/js/timeline/examples/example19_bar_graph.html but instead of bar graph, I need line graph. Essentially the question is, is it possible to get timeline and graph2d on the same canvas like in example below? With the help of the demo of syncing to timelines here and some experimenting of my own, the following seems to do something similar. You could probably tweak it a bit more to get what you want. The console warnings of "WARNING: infinite loop in redraw?"

I would like to build a network where the nodes represent information that is structured similarly to cards. With a card I mean a structure composed of two areas: multi-line text area where I can put information that comes from different resources, like a name, a phone number, an address and control area where I can have 2-3 buttons (preferably with icons) that maximize the node, or make the node a root/main one etc. As far as I could see from the vis.js documentation see example here , it is possible to enter paragraph/text as a node label but there is no way to structure a node via Html. Can

I'm new to JavaScript and using vis.js for making a hierarchical ("UD") network. I have a problem: many edges on the same level cross. Is there a way in vis.js to minimize crossed edges? In my example where I have a simple tree, there should no crossed edges at all. I.e. I want something like instead of My question is related to vis.js Level sorting in Hierarchical Layout Here are my vis.js options: var options = { edges: { smooth: { type: 'cubicBezier', roundness: 0.4 } }, layout: { improvedLayout: true, hierarchical: { direction: "UD" } }, physics:false }; Please try an older version of vis

My intention is to create simple graph editor using vis.js and the first feature I'm thinking about is to position nodes manually and save that. However, unlike setting options a straight-forward method to get all the options doesn't seem to exist. Is there any reasonable approach to get them (aside trying to track all the changes using events like dragEnd which sounds way too fragile)? In fact, I'm looking for a way to extract both data (nodes/edges and their settings) and options so that once the network is rendered using those options, it looks the same (or at least similar) to what was

How do I set a node's position in vis.js? I want to initially position at least one node manually. I know that a node has the options x and y . I set both, and also tried variations of layout options ( randomSeed , improvedLayout , hierarchical ), the node was never placed where I set it. Here's the simple network I defined: nodes = new vis.DataSet([ {id: 1, shape: 'circularImage', image: DIR + '1_circle', label:"1", x: 200, y: 100}, {id: 2, shape: 'circularImage', image: DIR + '2_circle', label:"2"}, {id: 3, shape: 'circularImage', image: DIR + '3_circle', label:"3"}, ]); edges = [ {id: "01