lint

threejs/background-v01.html

@@ -38,7 +38,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   const scene = new THREE.Scene();
 
   const aspect = 2;  // the canvas default

threejs/background.html

@@ -38,7 +38,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   const scene = new THREE.Scene();
 
   const aspect = 2;  // the canvas default

threejs/lessons/resources/threejs-lesson-utils.js

@@ -9,7 +9,7 @@ window.threejsLessonUtils = {
     }
     const canvas = document.querySelector('#c');
     const renderer = new THREE.WebGLRenderer({
-      canvas: canvas,
+      canvas,
       alpha: true,
       powerPreference: 'low-power',
     });

threejs/lessons/ru/threejs-cameras.md

@@ -359,9 +359,9 @@ const camera = new THREE.PerspectiveCamera(fov, aspect, near, far);
 `logarithmicDepthBuffer` когда мы создаем `WebGLRenderer`
 
 ```js
--const renderer = new THREE.WebGLRenderer({canvas: canvas});
+-const renderer = new THREE.WebGLRenderer({canvas});
 +const renderer = new THREE.WebGLRenderer({
-+  canvas: canvas,
++  canvas,
 +  logarithmicDepthBuffer: true,
 +});
 ```

threejs/lessons/ru/threejs-fundamentals.md

@@ -47,7 +47,7 @@ Three.js будет рисовать на этом холсте, так что
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   ...
 </script>
 ```

threejs/lessons/ru/threejs-lights.md

@@ -531,7 +531,7 @@ makeXYZGUI(gui, light.position, 'position', updateLight);
 Сначала мы включим физически правильное осещение
 
 ```js
-const renderer = new THREE.WebGLRenderer({canvas: canvas});
+const renderer = new THREE.WebGLRenderer({canvas});
 +renderer.physicallyCorrectLights = true;
 ```
 

threejs/lessons/threejs-backgrounds.md

@@ -30,9 +30,9 @@ drawing anything are transparent.
 ```js
 function main() {
   const canvas = document.querySelector('#c');
--  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+-  const renderer = new THREE.WebGLRenderer({canvas});
 +  const renderer = new THREE.WebGLRenderer({
-+    canvas: canvas,
++    canvas,
 +    alpha: true,
 +  });
 ```
@@ -266,7 +266,7 @@ will clear our first render and we won't see the background. We can do this by
 setting `renderer.autoClearColor = false`.
 
 ```js
-const renderer = new THREE.WebGLRenderer({canvas: canvas});
+const renderer = new THREE.WebGLRenderer({canvas});
 +renderer.autoClearColor = false;
 ```
 

threejs/lessons/threejs-cameras.md

@@ -363,9 +363,9 @@ pixels are in front and which are behind. We can do that by enabling
 `logarithmicDepthBuffer` when we create the `WebGLRenderer`
 
 ```js
--const renderer = new THREE.WebGLRenderer({canvas: canvas});
+-const renderer = new THREE.WebGLRenderer({canvas});
 +const renderer = new THREE.WebGLRenderer({
-+  canvas: canvas,
++  canvas,
 +  logarithmicDepthBuffer: true,
 +});
 ```

threejs/lessons/threejs-fundamentals.md

@@ -46,7 +46,7 @@ and pass it to three.js.
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   ...
 </script>
 ```

threejs/lessons/threejs-lights.md

@@ -539,7 +539,7 @@ Let's test that.
 First we'll turn on physically correct lights
 
 ```js
-const renderer = new THREE.WebGLRenderer({canvas: canvas});
+const renderer = new THREE.WebGLRenderer({canvas});
 +renderer.physicallyCorrectLights = true;
 ```
 

threejs/lessons/threejs-multiple-scenes.md

@@ -587,7 +587,7 @@ just turn on the scissor test at the beginning.
 function main() {
 -  const canvas = document.querySelector('#c');
 +  const canvas = document.createElement('canvas');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas, alpha: true});
+  const renderer = new THREE.WebGLRenderer({canvas, alpha: true});
 +  renderer.setScissorTest(true);
 
   ...

threejs/lessons/threejs-optimize-lots-of-objects-animated.md

@@ -454,7 +454,7 @@ To use it we'll create one
 ```js
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 +  const tweenManager = new TweenManger();
 
   ...

threejs/lessons/threejs-shadertoy.md

@@ -67,7 +67,7 @@ The first thing to do is let's make a single plane that fills the canvas. If you
 ```js
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   renderer.autoClearColor = false;
 
   const camera = new THREE.OrthographicCamera(

threejs/lessons/threejs-shadows.md

@@ -249,7 +249,7 @@ Let's start with the `DirectionaLight` with helper example from [the lights arti
 The first thing we need to do is turn on shadows in the renderer.
 
 ```js
-const renderer = new THREE.WebGLRenderer({canvas: canvas});
+const renderer = new THREE.WebGLRenderer({canvas});
 +renderer.shadowMap.enabled = true;
 ```
 

threejs/lessons/threejs-webvr.md

@@ -26,7 +26,7 @@ WebVR button to our page
 ```js
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 +  renderer.vr.enabled = true;
 +  document.body.appendChild(WEBVR.createButton(renderer));
 ```
@@ -294,7 +294,7 @@ in your code you could use that parameter like this
 ```js
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 -  renderer.vr.enabled = true;
 -  document.body.appendChild(WEBVR.createButton(renderer));
 

threejs/threejs-align-html-elements-to-3d-globe-too-many-labels.html

@@ -67,7 +67,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 60;
   const aspect = 2;  // the canvas default

threejs/threejs-align-html-elements-to-3d-globe.html

@@ -68,7 +68,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 60;
   const aspect = 2;  // the canvas default

threejs/threejs-align-html-to-3d-w-hiding.html

@@ -63,7 +63,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-align-html-to-3d-w-sorting.html

@@ -65,7 +65,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-align-html-to-3d.html

@@ -63,7 +63,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-background-css.html

@@ -30,7 +30,7 @@
 function main() {
   const canvas = document.querySelector('#c');
   const renderer = new THREE.WebGLRenderer({
-    canvas: canvas,
+    canvas,
     alpha: true,
   });
 

threejs/threejs-background-cubemap.html

@@ -28,7 +28,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   renderer.autoClearColor = false;
 
   const fov = 75;

threejs/threejs-background-equirectangularmap.html

@@ -28,7 +28,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   renderer.autoClearColor = false;
 
   const fov = 75;

threejs/threejs-background-scene-background-fixed-aspect.html

@@ -27,7 +27,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   renderer.autoClearColor = false;
 
   const fov = 75;

threejs/threejs-background-scene-background.html

@@ -27,7 +27,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   renderer.autoClearColor = false;
 
   const fov = 75;

threejs/threejs-background-separate-scene-bad-aspect.html

@@ -27,7 +27,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   renderer.autoClearColor = false;
 
   const fov = 75;

threejs/threejs-background-separate-scene.html

@@ -27,7 +27,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   renderer.autoClearColor = false;
 
   const fov = 75;

threejs/threejs-billboard-labels-w-sprites-adjust-height.html

@@ -28,7 +28,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-billboard-labels-w-sprites.html

@@ -28,7 +28,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-billboard-trees-no-billboards.html

@@ -28,7 +28,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-billboard-trees-static-billboards.html

@@ -28,7 +28,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-cameras-logarithmic-depth-buffer.html

@@ -31,7 +31,7 @@
 function main() {
   const canvas = document.querySelector('#c');
   const renderer = new THREE.WebGLRenderer({
-    canvas: canvas,
+    canvas,
     logarithmicDepthBuffer: true,
   });
   const fov = 45;

threejs/threejs-cameras-orthographic-2-scenes.html

@@ -48,7 +48,7 @@ function main() {
   const canvas = document.querySelector('#c');
   const view1Elem = document.querySelector('#view1');
   const view2Elem = document.querySelector('#view2');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const size = 1;
   const near = 5;

threejs/threejs-cameras-orthographic-canvas-top-left-origin.html

@@ -42,7 +42,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const left = 0;
   const right = 300;  // default canvas size

threejs/threejs-cameras-perspective-2-scenes.html

@@ -48,7 +48,7 @@ function main() {
   const canvas = document.querySelector('#c');
   const view1Elem = document.querySelector('#view1');
   const view2Elem = document.querySelector('#view2');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-cameras-perspective.html

@@ -30,7 +30,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-cameras-z-fighting.html

@@ -30,7 +30,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   const fov = 45;
   const aspect = 2;  // the canvas default
   const near = 0.00001;

threejs/threejs-canvas-textured-cube-qix.html

@@ -27,7 +27,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-canvas-textured-cube.html

@@ -27,7 +27,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-canvas-textured-labels-one-canvas.html

@@ -28,7 +28,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-canvas-textured-labels-scale-to-fit.html

@@ -28,7 +28,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-canvas-textured-labels.html

@@ -28,7 +28,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-debug-js-clearing-logger.html

@@ -54,7 +54,7 @@ class ClearingLogger {
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-debug-js-html-elements.html

@@ -41,7 +41,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-debug-js-params.html

@@ -103,7 +103,7 @@ if (debug) {
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-debugging-mcve.html

@@ -10,7 +10,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-fog-gui.html

@@ -28,7 +28,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   const gui = new dat.GUI();
 
   const fov = 75;

threejs/threejs-fog.html

@@ -27,7 +27,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-fundamentals-3-cubes.html

@@ -17,7 +17,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-fundamentals-with-animation.html

@@ -17,7 +17,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-fundamentals-with-light.html

@@ -17,7 +17,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-fundamentals.html

@@ -17,7 +17,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 75;
   const aspect = 2;  // the canvas default

threejs/threejs-indexed-textures-picking-and-highlighting.html

@@ -67,7 +67,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 60;
   const aspect = 2;  // the canvas default

threejs/threejs-indexed-textures-picking-debounced.html

@@ -67,7 +67,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 60;
   const aspect = 2;  // the canvas default

threejs/threejs-indexed-textures-picking.html

@@ -67,7 +67,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 60;
   const aspect = 2;  // the canvas default

threejs/threejs-indexed-textures-random-colors.html

@@ -67,7 +67,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 60;
   const aspect = 2;  // the canvas default

threejs/threejs-lights-ambient.html

@@ -30,7 +30,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-lights-directional-w-helper.html

@@ -30,7 +30,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-lights-directional.html

@@ -30,7 +30,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-lights-hemisphere.html

@@ -30,7 +30,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-lights-point-physically-correct.html

@@ -30,7 +30,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   renderer.physicallyCorrectLights = true;
 
   const fov = 45;

threejs/threejs-lights-point.html

@@ -30,7 +30,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-lights-rectarea.html

@@ -31,7 +31,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-lights-spot-w-helper.html

@@ -30,7 +30,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-load-gltf-animated-cars.html

@@ -31,7 +31,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-load-gltf-car-path-fixed.html

@@ -31,7 +31,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-load-gltf-car-path.html

@@ -31,7 +31,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-load-gltf-dump-scenegraph-extra.html

@@ -31,7 +31,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-load-gltf-dump-scenegraph.html

@@ -31,7 +31,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-load-gltf-rotate-cars-fixed.html

@@ -31,7 +31,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-load-gltf-rotate-cars.html

@@ -31,7 +31,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-load-gltf-shadows.html

@@ -31,7 +31,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   renderer.shadowMap.enabled = true;
 
   const fov = 45;

threejs/threejs-load-gltf.html

@@ -31,7 +31,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-load-obj-auto-camera-xz.html

@@ -31,7 +31,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-load-obj-auto-camera.html

@@ -31,7 +31,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-load-obj-materials-fixed.html

@@ -32,7 +32,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-load-obj-materials-windmill2.html

@@ -32,7 +32,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-load-obj-materials.html

@@ -32,7 +32,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-load-obj-no-materials.html

@@ -31,7 +31,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-load-obj-wat.html

@@ -31,7 +31,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-lots-of-objects-animated.html

@@ -82,7 +82,7 @@ class TweenManger {
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   const tweenManager = new TweenManger();
 
   const fov = 60;

threejs/threejs-lots-of-objects-merged-vertexcolors.html

@@ -29,7 +29,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 60;
   const aspect = 2;  // the canvas default

threejs/threejs-lots-of-objects-merged.html

@@ -29,7 +29,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 60;
   const aspect = 2;  // the canvas default

threejs/threejs-lots-of-objects-morphtargets-w-colors.html

@@ -82,7 +82,7 @@ class TweenManger {
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   const tweenManager = new TweenManger();
 
   const fov = 60;

threejs/threejs-lots-of-objects-morphtargets.html

@@ -82,7 +82,7 @@ class TweenManger {
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   const tweenManager = new TweenManger();
 
   const fov = 60;

threejs/threejs-lots-of-objects-multiple-data-sets.html

@@ -50,7 +50,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 60;
   const aspect = 2;  // the canvas default

threejs/threejs-lots-of-objects-slow.html

@@ -28,7 +28,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 60;
   const aspect = 2;  // the canvas default

threejs/threejs-multiple-scenes-controls.html

@@ -57,7 +57,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas, alpha: true});
+  const renderer = new THREE.WebGLRenderer({canvas, alpha: true});
 
   const sceneElements = [];
   function addScene(elem, fn) {

threejs/threejs-multiple-scenes-copy-canvas.html

@@ -52,7 +52,7 @@
 
 function main() {
   const canvas = document.createElement('canvas');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas, alpha: true});
+  const renderer = new THREE.WebGLRenderer({canvas, alpha: true});
   renderer.setScissorTest(true);
 
   const sceneElements = [];

threejs/threejs-multiple-scenes-generic.html

@@ -56,7 +56,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas, alpha: true});
+  const renderer = new THREE.WebGLRenderer({canvas, alpha: true});
 
   const sceneElements = [];
   function addScene(elem, fn) {

threejs/threejs-multiple-scenes-selector.html

@@ -56,7 +56,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas, alpha: true});
+  const renderer = new THREE.WebGLRenderer({canvas, alpha: true});
 
   const sceneElements = [];
   function addScene(elem, fn) {

threejs/threejs-multiple-scenes-v1.html

@@ -56,7 +56,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas, alpha: true});
+  const renderer = new THREE.WebGLRenderer({canvas, alpha: true});
 
   function makeScene(elem) {
     const scene = new THREE.Scene();

threejs/threejs-multiple-scenes-v2.html

@@ -57,7 +57,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas, alpha: true});
+  const renderer = new THREE.WebGLRenderer({canvas, alpha: true});
 
   function makeScene(elem) {
     const scene = new THREE.Scene();

threejs/threejs-multiple-scenes-v3.html

@@ -57,7 +57,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas, alpha: true});
+  const renderer = new THREE.WebGLRenderer({canvas, alpha: true});
 
   function makeScene(elem) {
     const scene = new THREE.Scene();

threejs/threejs-picking-gpu.html

@@ -27,7 +27,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 60;
   const aspect = 2;  // the canvas default

threejs/threejs-picking-raycaster-complex-geo.html

@@ -27,7 +27,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 60;
   const aspect = 2;  // the canvas default

threejs/threejs-picking-raycaster-transparency.html

@@ -27,7 +27,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 60;
   const aspect = 2;  // the canvas default

threejs/threejs-picking-raycaster.html

@@ -27,7 +27,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 60;
   const aspect = 2;  // the canvas default

threejs/threejs-postprocessing-3dlut-identity.html

@@ -34,7 +34,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
 
   const fov = 45;
   const aspect = 2;  // the canvas default

threejs/threejs-postprocessing-3dlut-prep.html

@@ -30,7 +30,7 @@
 
 function main() {
   const canvas = document.querySelector('#c');
-  const renderer = new THREE.WebGLRenderer({canvas: canvas});
+  const renderer = new THREE.WebGLRenderer({canvas});
   renderer.autoClearColor = false;
 
   const fov = 45;