added background

This commit is contained in:
leca 2024-02-02 01:31:36 +03:00
parent 12b1189a22
commit c1b2b1c4f3
5 changed files with 17 additions and 4 deletions

View File

@ -16,7 +16,7 @@
"three/addons/": "https://unpkg.com/three@0.158.0/examples/jsm/" "three/addons/": "https://unpkg.com/three@0.158.0/examples/jsm/"
} }
} }
</script> </script>
<script src="view/graphics.js" type="module"></script> <script src="view/graphics.js" type="module"></script>
<script src="view/controls.js" type="module"></script> <script src="view/controls.js" type="module"></script>
</body> </body>

View File

@ -11,8 +11,8 @@ const createWindow = () => {
app.on('ready', () => { app.on('ready', () => {
createWindow() createWindow()
}) });
app.on('window-all-closed', () => { app.on('window-all-closed', () => {
app.quit() app.quit()
}) });

4
view/controls.js vendored
View File

@ -1,8 +1,10 @@
import * as THREE from "three"; import * as THREE from "three";
let isMousePressed = false let isMousePressed = false
let sensetivityX = 0.5; let sensetivityX = 0.5;
let sensetivityY = 1.; let sensetivityY = 1.;
let fixedAxisMovement = false;
export class SpiralCamera { export class SpiralCamera {
constructor(canvas, segmentHeight) { constructor(canvas, segmentHeight) {
@ -33,7 +35,7 @@ export class SpiralCamera {
if (isMousePressed) { if (isMousePressed) {
let horizontal = event.movementX; let horizontal = event.movementX;
let vertical = event.movementY; let vertical = event.movementY;
Math.abs(horizontal) > Math.abs(vertical)? vertical = 0 : horizontal = 0; if (fixedAxisMovement) Math.abs(horizontal) > Math.abs(vertical)? vertical = 0 : horizontal = 0;
this.updateCameraPosition(horizontal * sensetivityX, vertical * sensetivityY); this.updateCameraPosition(horizontal * sensetivityX, vertical * sensetivityY);
} }
}); });

View File

@ -5,6 +5,7 @@ import { TextGeometry } from 'three/addons/geometries/TextGeometry.js';
import { FontLoader } from 'three/addons/loaders/FontLoader.js'; import { FontLoader } from 'three/addons/loaders/FontLoader.js';
const spiralMaterial = new THREE.ShaderMaterial( { const spiralMaterial = new THREE.ShaderMaterial( {
uniforms: { uniforms: {
@ -71,6 +72,15 @@ let viewDistance = 5;
//setting scene //setting scene
const scene = new THREE.Scene(); const scene = new THREE.Scene();
const loader = new THREE.TextureLoader();
const texture = loader.load(
'view/img/space.jpg',
() => {
texture.mapping = THREE.EquirectangularReflectionMapping;
texture.colorSpace = THREE.SRGBColorSpace;
scene.background = texture;
});
//setting canvas //setting canvas
var canvas = document.querySelector('#canvas'); var canvas = document.querySelector('#canvas');
const renderer = new THREE.WebGLRenderer({ antialias: true, canvas }); const renderer = new THREE.WebGLRenderer({ antialias: true, canvas });
@ -121,6 +131,7 @@ addEventListener("changedViewYear", (e) => {
viewingYear = newYear; viewingYear = newYear;
}); });
//main loop //main loop
function animate() { function animate() {
if (resizeRendererToDisplaySize(renderer)) { if (resizeRendererToDisplaySize(renderer)) {

BIN
view/img/space.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 755 KiB