How to use troika-3d-ui - 4 common examples
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.
protectwise / troika / packages / troika-examples / ui2 / ColorCubes.js View on Github 
}
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)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)})
))
}
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)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)
