constructor()

in packages/polaris/polaris-lite/src/renderer/LiteRenderer.ts [127:257]

• 88 lines of code
• 5 McCabe index (conditional complexity)

	constructor(props: RendererConfig) {
		super()

		this.config = {
			...defaultProps,
			...props,
		}

		/**
		 * @stage_0 MPV
		 */
		const canvasWidth = this.config.width * (this.config.ratio ?? 1.0)
		const canvasHeight = this.config.height * (this.config.ratio ?? 1.0)
		const canvas = document.createElement('canvas')
		canvas.width = canvasWidth
		canvas.height = canvasHeight
		canvas.style.position = 'absolute'
		canvas.style.left = '0px'
		canvas.style.top = '0px'
		canvas.style.width = this.config.width + 'px'
		canvas.style.height = this.config.height + 'px'
		this.canvas = canvas

		// Converter
		this.conv = new Converter({
			matrixProcessor: this.config.matrixProcessor,
			boundingProcessor: this.config.boundingProcessor,
			graphProcessor: this.config.graphProcessor,
			cullingProcessor: this.config.cullingProcessor,
		})

		/**
		 * init renderer
		 */

		this.renderer = new WebGLRenderer({
			canvas: this.canvas,
			alpha: true,
			antialias: this.config.antialias === 'msaa',
			stencil: false,
			premultipliedAlpha: this.config.background === 'transparent' ? false : true,
		})
		this.context = this.renderer.getContext()
		this.renderer.setClearAlpha(1.0)

		/**
		 * init webgl capabilities
		 */
		const gl = this.renderer.getContext()
		this._capabilities = {
			pointSizeRange: gl.getParameter(gl.ALIASED_POINT_SIZE_RANGE),
			lineWidthRange: gl.getParameter(gl.ALIASED_LINE_WIDTH_RANGE),
			maxVertexAttributes: gl.getParameter(gl.MAX_VERTEX_ATTRIBS),
			maxVaryingVectors: gl.getParameter(gl.MAX_VARYING_VECTORS),
		}

		/**
		 * init scene
		 */
		this.scene = new Scene()
		if (this.config.background === 'transparent') {
			this.scene.background = null
			this.renderer.setClearAlpha(0.0)
		} else {
			this.scene.background = new Color(this.config.background as string)
		}

		/**
		 * gsi three conv 不开启 decomposeMatrix ，不然性能很差。
		 * 这样做的问题是，conv 得到的 object3d 虽然 matrix 正确，但是 pos/rot/scale 是初始值，因此必须关掉 autoUpdate
		 * 副作用：
		 * - 如果要在场景中加入 three native object，必须手动调用 updateMatrix
		 * @note 应该在 standard layer 中提示这一点
		 */
		this.scene.matrixWorldAutoUpdate = false
		this.scene.matrixAutoUpdate = false

		this.rootWrapper = new SDK.Mesh()
		this.rootWrapper.name = 'rootWrapper'

		this.rootWrapper.add(this.config.root)

		/**
		 * init lights
		 */
		this.lights = new Object3D()
		this.lights.name = 'LightsWrapper'
		this.scene.add(this.lights)
		this.initLights()

		/**
		 * init Camera
		 * @note 整个 camera 的转换都放进 renderer 里，这里只提供 camera proxy
		 * 反正在哪里转都是一样的
		 */
		const { cameraNear, cameraFar } = this.config
		this.camera = new PerspectiveCamera(
			this.config.fov,
			this.config.width / this.config.height,
			cameraNear,
			cameraFar
		)
		this.camera.matrixAutoUpdate = false
		if (this.config.viewOffset) {
			this.camera.setViewOffset(
				this.config.width,
				this.config.height,
				this.config.viewOffset[0],
				this.config.viewOffset[1],
				this.config.viewOffset[2] ?? this.config.width,
				this.config.viewOffset[3] ?? this.config.height
			)
		}

		/**
		 * @stage_1 BI 需要
		 */

		/**
		 * @stage_2 只兼容桌面端，考虑是否放到 GL2 renderer 里，IE 是否需要？
		 */

		// init pp
		this.frame = new WebGLRenderTarget(canvasWidth, canvasHeight, {
			format: RGBAFormat,
			stencilBuffer: false,
			depthBuffer: true,
			samples: this.config.antialias === 'msaa' ? 4 : 0,
		})
		this.frame.depthTexture = new (DepthTexture as any)()
	}