How to use the troika-3d-ui.extendAsFlexNode function in troika-3d-ui

To help you get started, we’ve selected a few troika-3d-ui examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github protectwise / troika / packages / troika-examples / ui2 / ColorCubes.js View on Github external
}

  afterUpdate() {
    const childDef = this._childDef
    this.threeObject.visible = this.offsetWidth != null
    childDef.animation = (this.hovering) ? animPaused : anim

    // Center within the layed out box
    this.x = this.offsetLeft + this.offsetWidth / 2
    this.y = -(this.offsetTop + this.offsetHeight / 2)
    childDef.scale = Math.min(this.clientWidth, this.clientHeight) / Math.sqrt(2)
    super.afterUpdate()
  }
}

export default extendAsFlexNode(CubeOfCubes)
github protectwise / troika / packages / troika-examples / ui / CubeOfCubes.js View on Github external
this.onCubeClick(e.target.id)
    }
  }

  afterUpdate() {
    this.threeObject.visible = this.offsetWidth != null

    // Center within the layed out box
    this.x = this.offsetLeft + this.offsetWidth / 2
    this.y = -(this.offsetTop + this.offsetHeight / 2)
    this.scaleX = this.scaleY = this.scaleZ = Math.min(this.clientWidth, this.clientHeight) / Math.sqrt(2)
    super.afterUpdate()
  }
}

export default extendAsFlexNode(CubeOfCubes)
github protectwise / troika / packages / troika-examples / ui / FlexboxGlobe.js View on Github external
})
    ))
  }

  afterUpdate() {
    this.threeObject.visible = this.offsetWidth != null

    // Center the globe within the layed out box
    this.x = this.offsetLeft + this.offsetWidth / 2
    this.y = -(this.offsetTop + this.offsetHeight / 2)
    this.scaleX = this.scaleY = this.scaleZ = Math.min(this.clientWidth, this.clientHeight)
    super.afterUpdate()
  }
}

export default extendAsFlexNode(FlexboxGlobe)
github protectwise / troika / packages / troika-examples / ui / FlexboxLineGraph.js View on Github external
if (this.offsetWidth) {
      const childDef = this.curveChildDef
      childDef.values = this.values
      childDef.x = this.offsetLeft + this.clientLeft
      childDef.y = -(this.offsetTop + this.clientTop + this.clientHeight)
      childDef.width = this.clientWidth
      childDef.height = this.clientHeight
      childDef.strokeColor = childDef.fillColor = this.color
      childDef.renderOrder = this.flexNodeDepth + this.z
      this.children = childDef
    }
    super.afterUpdate()
  }
}

export default extendAsFlexNode(FlexboxLineGraph)

troika-3d-ui

Troika 3D User Interface Toolkit

MIT
Latest version published 1 month ago

Package Health Score

75 / 100
Full package analysis

Popular troika-3d-ui functions

Similar packages