|
|
@@ -8,26 +8,17 @@
|
|
|
</head>
|
|
|
<body>
|
|
|
|
|
|
- <div id="container"></div>
|
|
|
<div id="info"><a href="https://threejs.org" target="_blank" rel="noopener">three.js</a> WebGL 2 - buffergeometry - attributes - none</div>
|
|
|
|
|
|
- <script id="vertexShader" type="x-shader/x-vertex">
|
|
|
+ <script id="vertexShader" type="x-shader/x-vertex">
|
|
|
|
|
|
uniform mat4 modelViewMatrix;
|
|
|
uniform mat4 projectionMatrix;
|
|
|
|
|
|
uniform float seed;
|
|
|
|
|
|
- /*
|
|
|
- const float PHI = 1.61803398874989484820459; // Φ = Golden Ratio
|
|
|
-
|
|
|
- float goldNoise(vec2 xy){
|
|
|
- return fract(tan(distance(xy*PHI, xy)*seed)*xy.x);
|
|
|
- }
|
|
|
- */
|
|
|
-
|
|
|
const uint ieeeMantissa = 0x007FFFFFu;
|
|
|
- const uint ieeeOne = 0x3F800000u;
|
|
|
+ const uint ieeeOne = 0x3F800000u;
|
|
|
|
|
|
uint hash(uint x) {
|
|
|
x += ( x << 10u );
|
|
|
@@ -96,7 +87,8 @@
|
|
|
<script type="importmap">
|
|
|
{
|
|
|
"imports": {
|
|
|
- "three": "../build/three.module.js"
|
|
|
+ "three": "../build/three.module.js",
|
|
|
+ "three/addons/": "./jsm/"
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
@@ -105,7 +97,7 @@
|
|
|
|
|
|
import * as THREE from 'three';
|
|
|
|
|
|
- import WebGL from './jsm/capabilities/WebGL.js';
|
|
|
+ import WebGL from 'three/addons/capabilities/WebGL.js';
|
|
|
|
|
|
if ( WebGL.isWebGL2Available() === false ) {
|
|
|
|
|
|
@@ -131,10 +123,10 @@
|
|
|
|
|
|
const triangleCount = 10000;
|
|
|
const vertexCountPerTriangle = 3;
|
|
|
- const vertexCount = triangleCount*vertexCountPerTriangle;
|
|
|
+ const vertexCount = triangleCount * vertexCountPerTriangle;
|
|
|
|
|
|
- const geometry = new THREE.BufferGeometry();
|
|
|
- geometry.setDrawRange(0, vertexCount);
|
|
|
+ const geometry = new THREE.BufferGeometry();
|
|
|
+ geometry.setDrawRange( 0, vertexCount );
|
|
|
|
|
|
// material
|
|
|
|
|
|
@@ -157,18 +149,19 @@
|
|
|
// renderer
|
|
|
|
|
|
renderer = new THREE.WebGLRenderer( { antialias: true } );
|
|
|
+ renderer.setPixelRatio( window.devicePixelRatio );
|
|
|
renderer.setSize( window.innerWidth, window.innerHeight );
|
|
|
document.body.appendChild( renderer.domElement );
|
|
|
|
|
|
}
|
|
|
|
|
|
- function animate(time) {
|
|
|
+ function animate( time ) {
|
|
|
|
|
|
requestAnimationFrame( animate );
|
|
|
|
|
|
- mesh.rotation.x = time/1000.0 * 0.25;
|
|
|
- mesh.rotation.y = time/1000.0 * 0.50;
|
|
|
-
|
|
|
+ mesh.rotation.x = time / 1000.0 * 0.25;
|
|
|
+ mesh.rotation.y = time / 1000.0 * 0.50;
|
|
|
+
|
|
|
renderer.render( scene, camera );
|
|
|
|
|
|
}
|
Michael Herzog