render(){
    // request animation frame for continued running
    requestAnimationFrame(() => this.render());

    // Only iterate through the layout for a given number of steps.
    if(this.iteration < this.max_iterations){
      // run instances of our layout simulation
      this.simulation.tick();

      // update mesh attributes.
      this.updatePositions();
      this.iteration += 1;

      // does the user want a progress message
      if(this.show_simulation_progress){
        // if this is our last iteration we should hide the progress
        if(this.iteration === this.max_iterations){
         this.simulation_progress.hide();
        } else {
          // otherwise let's increment it.
          this.simulation_progress.update(this.iteration);
        }
      }
    }


    if(this.interactive){
        // update our raycaster with current mouse position
      this.raycaster.setFromCamera(this.mouse, this.camera);

      // figure out what points it intersects
      const intersects = this.raycaster.intersectObject(this.node_mesh);
      const anyPointsSelected = intersects.length > 0;

      if(anyPointsSelected){
        // find all nodes intersected that the user want's selected
        const intersectedNodes = intersects
          .map(d => Object.assign({},this.nodes[d.index], {node_index: d.index}))
          .filter(d => d.selectable || this.select_all);

        const applicablePointsSelected = intersectedNodes.length !== 0;

        if(applicablePointsSelected){
          const newSelection = intersectedNodes[0];
          const noPreviousSelection = this.currentlySelected === null;
          const differentFromLastSelection = noPreviousSelection || (newSelection.name !== this.currentlySelected.name);

          if(differentFromLastSelection){
            // reset the sizes of the other nodes
            this.resetNodeColorSize();
          }

          if(noPreviousSelection || differentFromLastSelection){
            // set our selection with the new one
            this.currentlySelected = newSelection;
          }

          // expand selected node
          this.expandNode(this.currentlySelected.node_index);

          // update tooltip with name of node.
          this.tooltip.update(this.currentlySelected.name, this.mouseRaw);

        } else {
          // if this is the first frame without something selected, reset the sizes
          if(this.currentlySelected){
            this.hideTooltipSelection();
          }
        }
      } else {
         this.hideTooltipSelection();
      }
    }

    // Grab new position from controls (if user has dragged, etc)
    this.controls.update();

    // actually draw to the screen!
    this.renderer.render(this.scene, this.camera);
  }
// main render function. This gets called repeatedly
main render function. This gets called repeatedly
main render function . This gets called repeatedly
render(){
    requestAnimationFrame(() => this.render());
    if(this.iteration < this.max_iterations){
      this.simulation.tick();
      this.updatePositions();
      this.iteration += 1;
      if(this.show_simulation_progress){
        if(this.iteration === this.max_iterations){
         this.simulation_progress.hide();
        } else {
          this.simulation_progress.update(this.iteration);
        }
      }
    }
    if(this.interactive){
      this.raycaster.setFromCamera(this.mouse, this.camera);
      const intersects = this.raycaster.intersectObject(this.node_mesh);
      const anyPointsSelected = intersects.length > 0;
      if(anyPointsSelected){
        const intersectedNodes = intersects
          .map(d => Object.assign({},this.nodes[d.index], {node_index: d.index}))
          .filter(d => d.selectable || this.select_all);
        const applicablePointsSelected = intersectedNodes.length !== 0;
        if(applicablePointsSelected){
          const newSelection = intersectedNodes[0];
          const noPreviousSelection = this.currentlySelected === null;
          const differentFromLastSelection = noPreviousSelection || (newSelection.name !== this.currentlySelected.name);
          if(differentFromLastSelection){
            this.resetNodeColorSize();
          }
          if(noPreviousSelection || differentFromLastSelection){
            this.currentlySelected = newSelection;
          }
          this.expandNode(this.currentlySelected.node_index);
          this.tooltip.update(this.currentlySelected.name, this.mouseRaw);
        } else {
          if(this.currentlySelected){
            this.hideTooltipSelection();
          }
        }
      } else {
         this.hideTooltipSelection();
      }
    }
    this.controls.update();
    this.renderer.render(this.scene, this.camera);
  }
render ( ) { requestAnimationFrame ( ( ) => this . render ( ) ) ; if ( this . iteration < this . max_iterations ) { this . simulation . tick ( ) ; this . updatePositions ( ) ; this . iteration += 1 ; if ( this . show_simulation_progress ) { if ( this . iteration === this . max_iterations ) { this . simulation_progress . hide ( ) ; } else { this . simulation_progress . update ( this . iteration ) ; } } } if ( this . interactive ) { this . raycaster . setFromCamera ( this . mouse , this . camera ) ; const intersects = this . raycaster . intersectObject ( this . node_mesh ) ; const anyPointsSelected = intersects . length > 0 ; if ( anyPointsSelected ) { const intersectedNodes = intersects . map ( d => Object . assign ( { } , this . nodes [ d . index ] , { node_index : d . index } ) ) . filter ( d => d . selectable || this . select_all ) ; const applicablePointsSelected = intersectedNodes . length !== 0 ; if ( applicablePointsSelected ) { const newSelection = intersectedNodes [ 0 ] ; const noPreviousSelection = this . currentlySelected === null ; const differentFromLastSelection = noPreviousSelection || ( newSelection . name !== this . currentlySelected . name ) ; if ( differentFromLastSelection ) { this . resetNodeColorSize ( ) ; } if ( noPreviousSelection || differentFromLastSelection ) { this . currentlySelected = newSelection ; } this . expandNode ( this . currentlySelected . node_index ) ; this . tooltip . update ( this . currentlySelected . name , this . mouseRaw ) ; } else { if ( this . currentlySelected ) { this . hideTooltipSelection ( ) ; } } } else { this . hideTooltipSelection ( ) ; } } this . controls . update ( ) ; this . renderer . render ( this . scene , this . camera ) ; }
main render function.
main render function .
// request animation frame for continued running // Only iterate through the layout for a given number of steps. // run instances of our layout simulation // update mesh attributes. // does the user want a progress message // if this is our last iteration we should hide the progress // otherwise let's increment it. // update our raycaster with current mouse position // figure out what points it intersects // find all nodes intersected that the user want's selected // reset the sizes of the other nodes // set our selection with the new one // expand selected node // update tooltip with name of node. // if this is the first frame without something selected, reset the sizes // Grab new position from controls (if user has dragged, etc) // actually draw to the screen!