plotly/react-cytoscapejs

Locked nodes

Opened this issue · 1 comments

Trying out the README example which renders the nodes but not able to move the nodes individually no matter what. Entire layout (two nodes and the edge) move in unison whenever I click on either nodes. What am I missing in order to grab individual nodes and move?

import React from 'react';
import CytoscapeComponent from 'react-cytoscapejs';

export default class Cyto extends React.Component {
    constructor(props){
        super(props);
    }

    render(){
        const elements = [
            { data: { id: 'one', label: 'Node 1' }, position: { x: 0, y: 0 } },
            { data: { id: 'two', label: 'Node 2' }, position: { x: 100, y: 0 } },
            { data: { source: 'one', target: 'two', label: 'Edge from Node1 to Node2' } }
        ];

        const layout = {
            name: 'grid'
        }

        return <CytoscapeComponent elements={elements} style={{ height: '600px' }} layout={layout} />;
    }
}

can you create an example on e.g. codesandbox to illustrate the behavior, cause in my test it works as expected