Options
All
  • Public
  • Public/Protected
  • All
Menu

Class NgxRendererComponent

The Renderer component.

See the ngx3js docs page for details. See the ngx renderer page for a live demo.

<ngx3js-renderer
    [controlType]="'orbit'"
    [controlOptions]="{
        enablePan: false,
        enableDamping: true
    }"
    [cssType]="'css2d'"
    [statsMode]="0" [antialias]="true" [shadowMapEnabled]="true"
    [guiControl]="controls" [guiParams]="controlsParams"
    (onRender)="onRender($event)"
></ngx3js-renderer>
see

THREE.WebGLRenderer

see

SVGRenderer

Hierarchy

Implements

Index

Constructors

Properties

Accessors

Methods

Constructors

constructor

Properties

Protected OBJECT_ATTR

OBJECT_ATTR: string[] = ...

Object attr of abstract subscribe component

Protected _changeList

_changeList: string[] = null

Change list of abstract subscribe component

Protected _needUpdate

_needUpdate: boolean = true

Need update of abstract subscribe component

Protected _sizeSubject

_sizeSubject: Subject<I3JS.Vector2> = ...

Size subject of renderer component

Protected _updateSubject

_updateSubject: Subject<IRendererTimer> = ...

Update subject of renderer component

Protected _userGestureSubject

_userGestureSubject: Subject<boolean> = ...

User gesture subject of renderer component

afterRender

afterRender: (info: IRendererInfo) => any = null

Type declaration

alpha

alpha: boolean = false

whether to perform alpha. Default is false.

antialias

antialias: boolean = false

whether to perform antialiasing. Default is false.

autoClear

autoClear: boolean = null

Defines whether the renderer should automatically clear its output before rendering a frame.

autoClearColor

autoClearColor: boolean = true

If WebGLRenderer.autoClear is true, defines whether the renderer should clear the color buffer. Default is true.

beforeRender

beforeRender: (info: IRendererInfo) => boolean = null

Type declaration

camera

camera: NgxCameraComponent = null

The camera of renderer component

clearAlpha

clearAlpha: number = null

Sets the alpha of the clear color

clearColor

clearColor: string | number = null

Sets the clear color

composerEnable

composerEnable: boolean = true

The guiOpen of GUI

controlOptions

controlOptions: IControlOptions = null

The options of control

controlType

controlType: string = 'none'

The type of control

Three Type Value String(case insensitive)
FlyControls FlyControls, Fly
FirstPersonControls FirstPersonControls, FirstPerson
DeviceOrientationControls DeviceOrientationControls, DeviceOrientation
DragControls DragControls, Drag
TransformControls TransformControls, Transform
TrackballControls TrackballControls, Trackball
ArcballControls ArcballControls, Arcball
CSM CSM
PlaneControls PlaneControls, Plane
OrbitControls OrbitControls, Orbit
see

NgxControlComponent

cssClass

cssClass: string = ''

The type of css canvas class

cssType

cssType: string = 'none'

The type of css renderer

Three Type Value String(case insensitive)
CSS2DRenderer CSS2DRenderer, CSS2D, 2D
CSS3DRenderer CSS3DRenderer, CSS3D, 3D

mixed - "css3d,css2d", "css2d,css3d"

debug

debug: boolean = false

Debug this Object

enabled

enabled: boolean = true

Enabled or Not

globalClippingEnabled

globalClippingEnabled: boolean = null

User-defined clipping planes specified as THREE.Plane objects in world space.

gui

gui: NgxThreeGui = null

The Gui of renderer component

guiControl

guiControl: any = null

The guiControl of GUI

guiOpen

guiOpen: boolean = false

The guiOpen of GUI

guiParams

guiParams: IGuiControlParam[] = []

The guiParams of GUI

guiStyle

guiStyle: any = null

The guiStyle of GUI

height

height: string | number = -1

The height of renderer

Protected id

id: string = ''

The Id of abstract subscribe component

loadingProcess

loadingProcess: ILoadingProcessInfo = null

localClippingEnabled

localClippingEnabled: boolean = null

Defines whether the renderer respects object-level clipping planes. Default is false.

logarithmicDepthBuffer

logarithmicDepthBuffer: boolean = false

whether to use a logarithmic depth buffer. It may be neccesary to use this if dealing with huge differences in scale in a single scene. Note that this setting uses gl_FragDepth if available which disables the Early Fragment Test optimization and can cause a decrease in performance. Default is false. See the [example:webgl_camera_logarithmicdepthbuffer camera / logarithmicdepthbuffer] example.

onDestory

onDestory: EventEmitter<NgxRendererComponent> = ...

Will be called when before destory. The argument will be the loaded self

onLoad

onLoad: EventEmitter<NgxRendererComponent> = ...

Will be called when load completes. The argument will be the loaded self

outputEncoding

outputEncoding: string = null

Defines the output encoding of the renderer. Default is THREE.LinearEncoding. If a render target has been set using .setRenderTarget then renderTarget.texture.encoding will be used instead. See the texture constants page for details of other formats.

Three Type Value String(case insensitive)
THREE.sRGBEncoding sRGBEncoding, sRGB
THREE.GammaEncoding GammaEncoding, Gamma
THREE.RGBEEncoding RGBEEncoding, RGBE
THREE.LogLuvEncoding LogLuvEncoding, LogLuv
THREE.RGBM7Encoding RGBM7Encoding, RGBM7
THREE.RGBM16Encoding RGBM16Encoding, RGBM16
THREE.RGBDEncoding RGBDEncoding, RGBD
THREE.LinearEncoding LinearEncoding, Linear

overrideParams

overrideParams: {} = null

The override params

Type declaration

  • [key: string]: any

Protected parent

parent: any = null

The Parent of abstract subscribe component

physicallyCorrectLights

physicallyCorrectLights: boolean = null

Whether to use physically correct lighting mode. Default is false. See the [example:webgl_lights_physical lights / physical] example.

preserveDrawingBuffer

preserveDrawingBuffer: boolean = false

whether to preserve the buffers until manually cleared or overwritten. Default is false.

quality

quality: string = null

The quality of SVGRenderer

Notice - case insensitive.

high - high quality. low - low quality.

renderer

renderer: Renderer = null

The Renderer of renderer component

rendererHeight

rendererHeight: number = 768

Renderer height of renderer component

rendererWidth

rendererWidth: number = 1024

Renderer width of renderer component

requiredExtensions

requiredExtensions: string[] = null

The requiredExtensions of renderer component

scene

scene: NgxSceneComponent = null

The scene of renderer component

Protected selfAny

selfAny: any = ...

shadowMapEnabled

shadowMapEnabled: boolean = true

If set, use shadow maps in the scene. Default is true.

shadowMapType

shadowMapType: string = null

Defines shadow map type (unfiltered, percentage close filtering, percentage close filtering with bilinear filtering in shader) Options are THREE.BasicShadowMap, THREE.PCFShadowMap (default), THREE.PCFSoftShadowMap and THREE.VSMShadowMap. See Renderer constants for details.

Notice - case insensitive.

sizeType

sizeType: string = 'auto'

The Input of renderer component

Notice - case insensitive.

auto - auto fix the size of renderer. fixed - use fixed size of renderer.

statsMode

statsMode: number = -1

the stats mode of stats module

statsStyle

statsStyle: any = null

The statsStyle of stats module

Protected subscribeType

subscribeType: string = null

Subscribe type of abstract subscribe component

toneMapping

toneMapping: string = null

Default is NoToneMapping. See the Renderer constants for other choices.

Three Type Value String(case insensitive)
THREE.LinearToneMapping LinearToneMapping, Linear
THREE.ReinhardToneMapping ReinhardToneMapping, Reinhard
THREE.CineonToneMapping CineonToneMapping, CineonTone
THREE.ACESFilmicToneMapping ACESFilmicToneMapping, ACESFilmic
THREE.NoToneMapping NoToneMapping, No

toneMappingExposure

toneMappingExposure: number = null

Exposure level of tone mapping. Default is 1.

tween

tween: {} = null

Tween animation params

Type declaration

  • [key: string]: any

type

type: string = 'webgl'

The type of renderer

Three Type Value String(case insensitive)
SVGRenderer SVGRenderer, SVG
THREE.WebGLRenderer WebGLRenderer, WebGL, GL, WebGL2

useAssetLoading

useAssetLoading: boolean = true

The useAssetLoading of GUI

useEvent

useEvent: string = null

The Input of renderer component

Notice - case insensitive.

string join by ,

change - change. pointerdown, mousedown, down - pointerdown. pointerup, mouseup, up - pointerup. pointermove, mousemove, move - pointermove. keydown - keydown. keyup - keyup. keypress - keypress. click - click. mouseover - mouseover, over. mouseout - mouseout, out.

see

HTMLElement.addEventListener

userData

userData: any = null

An object that can be used to store custom data about the Object3D. It should not hold references to functions as these will not be cloned.

width

width: string | number = -1

The width of renderer

windowExport

windowExport: string = null

Export this Object to window global variables

x

x: string | number = 0

The x position of renderer

number : fixed position. string : % - the percent of renderer. string : % -/+ number - the percent of renderer and add some value.

xrEnabled

xrEnabled: boolean = false

The xrEnabled of renderer component

y

y: string | number = 0

The y position of renderer

number : fixed position. string : % - the percent of renderer. string : % -/+ number - the percent of renderer and add some value.

Accessors

needUpdate

  • set needUpdate(value: boolean): void

  • Sets need update

    Parameters

    • value: boolean

    Returns void

Methods

addChanges

  • addChanges(key: string | string[] | SimpleChanges): void

addEvent

  • addEvent(type: string, listener: any): any

applyChanges

  • applyChanges(changes: string[]): void

Protected callOnLoad

  • callOnLoad(): void

changeAutoSize

  • changeAutoSize(): void

Protected checkChanges

  • checkChanges(changes: SimpleChanges): SimpleChanges

Protected clearChanges

  • clearChanges(): void

Protected consoleLog

  • consoleLog(key: string, object: any, level?: string): void

Protected consoleLogTime

  • consoleLogTime(key: string, object: any, repeat?: number): void

Protected destroyLocalComponent

  • destroyLocalComponent(key: string): void

dispose

  • dispose(): void

getCanvasJson

  • getCanvasJson(callback: (json: any) => void, options?: { height?: number; name?: string; type?: string; width?: number }): void

  • Gets canvas json

    Parameters

    • callback: (json: any) => void
        • (json: any): void

        • Parameters

          • json: any

          Returns void

    • Optional options: { height?: number; name?: string; type?: string; width?: number }
      • Optional height?: number
      • Optional name?: string
      • Optional type?: string
      • Optional width?: number

    Returns void

Protected getChanges

  • getChanges(): string[]

getId

  • getId(): string

getObject

  • getObject<T>(): T

getRenderControl

getRenderInfo

getRenderer

getSize

getSubscribe

  • getSubscribe(): Observable<string[]>

Protected getTimeout

  • getTimeout(timeDelay?: number): Promise<void>

getUserData

  • getUserData(): {}

Protected initLocalComponent

  • initLocalComponent<T>(key: string, component: T): T

Protected isIdEuals

  • isIdEuals(id: string): boolean

ngAfterContentInit

  • ngAfterContentInit(): void

ngAfterViewInit

  • ngAfterViewInit(): void

  • A callback method that is invoked immediately after Angular has completed initialization of a component's view. It is invoked only once when the view is instantiated.

    Returns void

ngOnChanges

  • ngOnChanges(changes: SimpleChanges): void

  • A callback method that is invoked immediately after the default change detector has checked the directive's data-bound properties for the first time, and before any of the view or content children have been checked. It is invoked only once when the directive is instantiated. default change detector has checked data-bound properties if at least one has changed, and before the view and content children are checked.

    Parameters

    • changes: SimpleChanges

      The changed properties.

    Returns void

ngOnDestroy

  • ngOnDestroy(): void

ngOnInit

  • ngOnInit(): void

  • A callback method that is invoked immediately after the default change detector has checked the directive's data-bound properties for the first time, and before any of the view or content children have been checked. It is invoked only once when the directive is instantiated.

    Returns void

removeEvent

  • removeEvent(type: string, listener: any): any

render

  • render(): void

resetTween

  • resetTween(): void

resizeCanvas

  • resizeCanvas(width: number, height: number): void

resizeRender

  • resizeRender(): void

runSubscribeNext

  • runSubscribeNext(key: string | string[]): void

setLoadingProcess

  • setLoadingProcess(url: string, loaded: number, total: number): void

Protected setObject

  • setObject(obj: any): void

setParent

  • setParent(parent: any): boolean

setSize

  • setSize(width: number, height: number): void

setSubscribeNext

  • setSubscribeNext(key: string | string[]): void

setSubscribeType

  • setSubscribeType(subscribeType: string): void

setTween

  • setTween(tweenData: {}): void

setTweenTarget

  • setTweenTarget(tweenTarget: any): void

setUserData

  • setUserData(key: string, value: any): void

sizeSubscribe

Protected subscribeListQuery

  • subscribeListQuery(queryList: QueryList<any>, subscribeKey: string, changeKey: string): void

Protected subscribeListQueryChange

  • subscribeListQueryChange(queryList: QueryList<any>, subscribeKey: string, changeKey: string): void

Protected subscribeRefer

  • subscribeRefer(key: string, subscription: Subscription): void

Protected subscribeReferList

  • subscribeReferList(key: string, subscription: Subscription): void

Protected unSubscribeRefer

  • unSubscribeRefer(key: string): void

Protected unSubscribeReferList

  • unSubscribeReferList(key: string): void

Protected unSubscription

  • unSubscription(subscriptions: Subscription[]): Subscription[]

updateInputParams

  • updateInputParams(params: {}, firstChange?: boolean, changes?: SimpleChanges, type?: string): void

updateSubscribe

userGestureSubscribe

  • userGestureSubscribe(ele?: HTMLElement): Observable<boolean>

Generated using TypeDoc