使用 THREE.WebGLRenderer 类可以创建一个 WebGL 渲染器，用于将 Three.js 场景渲染到 HTML 页面上。
初始化参数介绍：
-
parameters（可选）：这是一个包含各种初始化参数的对象，用于配置WebGLRenderer的行为。常见的参数包括：-
canvas：指定要渲染的<canvas>元素。如果不提供此参数，WebGLRenderer将会创建一个新的<canvas>元素，并添加到DOM中。 -
context：指定WebGL上下文。如果不提供此参数，WebGLRenderer将使用默认的WebGL上下文。 -
alpha：布尔值，指示是否开启画布的alpha通道。默认值为false。 -
antialias：布尔值，指示是否开启抗锯齿。默认值为false。 -
premultipliedAlpha：布尔值，指示是否预乘alpha。默认值为true。 -
preserveDrawingBuffer：布尔值，指示是否保留绘图缓冲区。默认值为false。 -
powerPreference：指定渲染器的电源偏好。可以是"default"、"high-performance"或"low-power"。默认值为"default"。 -
precision：指定着色器精度。可以是"highp"、"mediump"或"lowp"。默认值为"highp"。 -
stencil：布尔值，指示是否开启模板缓冲区。默认值为true。 -
depth：布尔值，指示是否开启深度缓冲区。默认值为true。 -
logarithmicDepthBuffer：布尔值，指示是否使用对数深度缓冲区。默认值为false。 -
physicallyCorrectLights：布尔值，指示是否开启物理正确的灯光计算。默认值为false。 -
toneMapping：指定色调映射算法。可以是THREE.NoToneMapping、THREE.LinearToneMapping、THREE.ReinhardToneMapping、THREE.CineonToneMapping等。默认值为THREE.NoToneMapping。 -
outputEncoding：指定渲染器的输出编码。可以是THREE.LinearEncoding、THREE.sRGBEncoding、THREE.GammaEncoding等。默认值为THREE.LinearEncoding。
-
以下是使用 THREE.WebGLRenderer 的基本步骤：
创建一个渲染器实例：
const renderer = new THREE.WebGLRenderer();
设置渲染器的尺寸：
renderer.setSize(width, height);
将渲染器的输出（画面）附加到 HTML 页面的 DOM 元素中：
const container = document.getElementById('container'); // 获取容器元素
container.appendChild(renderer.domElement); // 将渲染器的画布元素添加到容器中
渲染场景：
renderer.render(scene, camera);
在上述代码中，width 和 height 是渲染器的尺寸参数，决定了渲染器输出的画面大小。'container' 是 HTML 页面上一个具有相应 id 的元素，用作渲染器的容器。
注意事项：
- 渲染器需要附加到 HTML 页面上的 DOM 元素中，才能正常显示渲染结果。
- 渲染器的尺寸设置应与容器元素的尺寸相匹配，以保证画面的正确显示。
- 渲染场景时，需要传入待渲染的场景对象和相机对象作为参数。
除了上述基本使用方法，THREE.WebGLRenderer 还提供了许多其他选项和方法，用于配置和控制渲染过程，如设置背景色、阴影、抗锯齿等。你可以根据需要进一步探索和使用这些功能。
