1
0
mirror of https://github.com/troisjs/trois.git synced 2024-11-23 20:02:32 +08:00

WebGLRenderer constructor params #117

This commit is contained in:
Kevin Levron 2022-01-24 20:55:36 +01:00
parent da6396ccfe
commit bb6358716d
2 changed files with 6 additions and 3 deletions

View File

@ -1,5 +1,5 @@
/* eslint-disable no-use-before-define */ /* eslint-disable no-use-before-define */
import { Camera, Scene, WebGLRenderer } from 'three' import { Camera, Scene, WebGLRenderer, WebGLRendererParameters } from 'three'
import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer' import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer'
import { ComponentPublicInstance, defineComponent, InjectionKey, PropType } from 'vue' import { ComponentPublicInstance, defineComponent, InjectionKey, PropType } from 'vue'
import { bindObjectProp } from '../tools' import { bindObjectProp } from '../tools'
@ -98,6 +98,7 @@ export const RendererInjectionKey: InjectionKey<RendererPublicInterface> = Symbo
export default defineComponent({ export default defineComponent({
name: 'Renderer', name: 'Renderer',
props: { props: {
params: { type: Object as PropType<WebGLRendererParameters>, default: () => ({}) },
antialias: Boolean, antialias: Boolean,
alpha: Boolean, alpha: Boolean,
autoClear: { type: Boolean, default: true }, autoClear: { type: Boolean, default: true },
@ -131,6 +132,7 @@ export default defineComponent({
const config: ThreeConfigInterface = { const config: ThreeConfigInterface = {
canvas, canvas,
params: props.params,
antialias: props.antialias, antialias: props.antialias,
alpha: props.alpha, alpha: props.alpha,
autoClear: props.autoClear, autoClear: props.autoClear,

View File

@ -1,4 +1,4 @@
import { Camera, Object3D, OrthographicCamera, PerspectiveCamera, Scene, WebGLRenderer } from 'three' import { Camera, Object3D, OrthographicCamera, PerspectiveCamera, Scene, WebGLRenderer, WebGLRendererParameters } from 'three'
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js' import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js'
import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer.js' import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer.js'
import usePointer, { PointerConfigInterface, PointerPublicConfigInterface, PointerInterface } from './usePointer' import usePointer, { PointerConfigInterface, PointerPublicConfigInterface, PointerInterface } from './usePointer'
@ -12,6 +12,7 @@ export interface SizeInterface {
} }
export interface ThreeConfigInterface { export interface ThreeConfigInterface {
params?: WebGLRendererParameters
canvas?: HTMLCanvasElement canvas?: HTMLCanvasElement
antialias: boolean antialias: boolean
alpha: boolean alpha: boolean
@ -97,7 +98,7 @@ export default function useThree(params: ThreeConfigInterface): ThreeInterface {
* create WebGLRenderer * create WebGLRenderer
*/ */
function createRenderer(): WebGLRenderer { function createRenderer(): WebGLRenderer {
const renderer = new WebGLRenderer({ canvas: config.canvas, antialias: config.antialias, alpha: config.alpha }) const renderer = new WebGLRenderer({ canvas: config.canvas, antialias: config.antialias, alpha: config.alpha, ...config.params })
renderer.autoClear = config.autoClear renderer.autoClear = config.autoClear
return renderer return renderer
} }