Settings for ForceDirected

    var defaultOptions = {
                //id of the visualization container
                injectInto: contID,
                //Enable zooming and panning
                //by scrolling and DnD
                Navigation: {
                    enable: true,
                    //Enable panning events only if we're dragging the empty
                    //canvas (and not a node).
                    panning: 'avoid nodes',
                    zooming: 10 //zoom speed. higher is more sensible
                },
                // Change node and edge styles such as
                // color and width.
                // These properties are also set per node
                // with dollar prefixed data-properties in the
                // JSON structure.
                Node: {
                    overridable: true
                },
                Edge: {
                    overridable: true,
                    color: '#23A4FF',
                    lineWidth: 0.4
                },
                //Native canvas text styling
                Label: {
                    type: as.vis.options.labelType, //Native or HTML
                    size: 10,
                    style: 'bold', color: '#222'
                },
                //Add Tips
                Tips: {
                    enable: true,
                    onShow: function (tip, node) {
                        var callback = as.crud2callbacks[tableCode + "_showGraphTip"];
                        if (callback) {
                            callback(tip, node);
                        } else {
                            //count connections
                            var count = 0;
                            node.eachAdjacency(function () { count++; });
                            //display node info in tooltip
                            var s = "<div class='as-visGraphTipTitle'>" + node.name + "</div>";
                            if (node.data.$tip) {
                                s += "<div class='as-visGraphTipText text-muted'>" + node.data.$tip+"</div>";
                            }
                            tip.innerHTML = s;
                        }
                    }
                },
                // Add node events
                Events: {
                    enable: true,
                    type: 'Native',
                    //Change cursor style when hovering a node
                    onMouseEnter: function () {
                        fd.canvas.getElement().style.cursor = 'move';
                    },
                    onMouseLeave: function () {
                        fd.canvas.getElement().style.cursor = '';
                    },
                    //Update node positions when dragged
                    onDragMove: function (node, eventInfo, e) {
                        var pos = eventInfo.getPos();
                        node.pos.setc(pos.x, pos.y);
                        fd.plot();
                    },
                    //Implement the same handler for touchscreens
                    onTouchMove: function (node, eventInfo, e) {
                        $jit.util.event.stop(e); //stop default touchmove event
                        this.onDragMove(node, eventInfo, e);
                    },
                    //Add also a click handler to nodes
                    onClick: function (node) {
                        if (!node) return;
                        var callback = as.crud2callbacks[tableCode + "_clickGraphNode"];
                        if (callback) {
                            callback(node);
                        } else {
                            var s = "<h4>" + node.name + "</h4>";
                            var list = [];
                            node.eachAdjacency(function (adj) {
                                list.push(adj.nodeTo.name);
                            });
                            var el = $jit.id('as-visGraphNodePanel');
                            if(el) el.innerHTML = s + "<p class='text-muted small'>" + list.join(", ") +  "</p>";
                        }
                    }
                },
                //Number of iterations for the FD algorithm
                iterations: 200,
                //Edge length
                levelDistance: 100,
                // Add text to the labels. This method is only triggered
                // on label creation and only for DOM labels (not native canvas ones).
                onCreateLabel: function (domElement, node) {
                    domElement.innerHTML = node.name;
                    var style = domElement.style;
                    style.fontSize = "0.8em";
                    style.color = "#ddd";
                },
                // Change node styles when DOM labels are placed
                // or moved.
                onPlaceLabel: function (domElement, node) {
                    var style = domElement.style;
                    var left = parseInt(style.left);
                    var top = parseInt(style.top);
                    var w = domElement.offsetWidth;
                    style.left = (left - w / 2) + 'px';
                    style.top = (top + 10) + 'px';
                    style.display = '';
                }
            };