Position object is not working in first updateData method.

[24thdiv]

Hi, I want to fox the position of nodes so I am adding position:{x:value , y:value} in my regional nodes. I am refreshing my data using socket io every 3 seconds for new values in connections but my nodes and connections remains same. I am using vizceral-react for this project. Now the problem I am facing is that when first time I add data in my react component, nodes position randomly selected but after next iteration it uses my nodes position. I don't know why this is happing. This is my code.

 class App extends Component {

    constructor() {
      super();
       this.state={
         
         isShow:false,
          allowDraggingOfNodes:true
        }
          socket.on('event',function(data){
            self.setState({ trafficData: data, isShow:true });
          });
    }
render() {
    
    return (
      <div>
             <Vizceral traffic={this.state.trafficData}
                  allowDraggingOfNodes={this.state.allowDraggingOfNodes}
               />
       </div>
          
    );
  }
}

Every time I send my data with positions. This issue is common in simple javascript also thats why I created issue here.