Search code examples
javascriptvis.js

vis.js: remove property of item in dataset


I am using the vis.js visualization library. I have a vis.js dataset that was instantiated using

var nodes = new vis.DataSet([
    {id: 1, label: 'Item 1', group: "special"},
    {id: 2, label: 'Item 2'},
}

I would like to remove the group "special". Afterwards, the state of the dataset should be identical to a dataset that was instantiated without a group:

var nodes2 = new vis.DataSet([
    {id: 1, label: 'Item 1'},
    {id: 2, label: 'Item 2'},
}

How do you remove a property from an item within a dataset object, without removing the item itself?


Methods I have tested without success: nodes.update({id:1, groups: undefined}) nodes.update({id:1, groups: null}), nodes.update({id:1, groups: 0})


Solution

  • Vis JS, merges values of objects, thus only adding / modifying new values but not removing existing ones. I ended up with remove / insert logic. In your case I would do:

    const nodes = new vis.DataSet([
      {id: 1, label: 'Item 1', group: "special"},
      {id: 2, label: 'Item 2'},
    }
    
    const nodeId = 1;
    const propertyToRemove = 'group';
    // get a node
    const node = nodes.get(nodeId);
    // remove property
    delete node[propertyToRemove];
    
    // get positions (only for nodes with x and y coordinates)
    // only if x and y are not present on original node
    const coordinates = vis.Network.getPositions([nodeId])[nodeId];
    // copy coordinates
    node = Object.assign(node, coordinates); 
    
    // remove node
    nodes.remove(nodeId);
    // add cloned node
    nodes.add(node);
    

    you can write this code as function on vis.DataSet.prototype for convenience