VisJS lab

Реализация двусвязного списка

by downedcrane

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.9.0/vis.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.9.0/vis.min.css">
<h1>
Реализация двусвязного списка
</h1>
<button id="append">Append</button>
<button id="removeNode">Remove Node</button>
<div id="mynetwork"></div>

CSS

#mynetwork {
    width: 500px;
    height: 350px;
    border: 1px solid lightgray;
}

JavaScript

// create an array with nodes
var nodes = new vis.DataSet([])
/*
var nodes = new vis.DataSet([
{
    id: 1,
    label: 'Node 1'
}, {
    id: 2,
    label: 'Node 2'
}, {
    id: 3,
    label: 'Node 3'
}]);
*/
// create an array with edges
var edges = new vis.DataSet([
{
    from: 1,
    to: 2
}, {
    from: 2,
    to: 3
}]);

// create a network
var container = document.getElementById('mynetwork');

// provide the data in the vis format
var data = {
    nodes: nodes,
    edges: edges
};
// опции визуализации
var options = {
    layout: {
        randomSeed: undefined,
        improvedLayout: true,
        hierarchical: {
            enabled: true,
            levelSeparation: 180,
            direction: 'LR', // UD, DU, LR, RL
            sortMethod: 'directed' // hubsize, directed
        }
    }
}

// инициализация графа
var network = new vis.Network(container, data, options);

// переменные
var nodeNo = 0;
var lastNode = 0;
var firstNode = 0;

// /////// //
// функции //
// /////// //

$('#append').click(function () {
    dlist.add(dlist._length+1)
		
});

$('#removeNode').click(function () {
    dlist.remove()
		
});

/*
function Node(value) {
    this.id = value;
    this.label = value;
    this.previous = null;
    this.next = null;
}

function DoublyList() {
    this._length = 0;
    this.head = null;
    this.tail = null;
}
*/


function Node(value) {
    this.data = value;
    this.previous = null;
    this.next = null;
}

function DoublyList() {
    this._length = 0;
    this.head = null;
    this.tail = null;
}

DoublyList.prototype.add = function(value) {
    var node = new Node(value);
		console.log(value)
    if (this._length) {
        this.tail.next = node;
        node.previous = this.tail;				
        this.tail = node;
    } else {
        this.head = node;
        this.tail = node;
    }
		nodes.add({
        id: value,
        label: value
    });
		edges.add({
        from: value-1,
        to: value
    });
    
    this._length++;

   ...