game1
by Millieyan
HTML
<div id="info">Game Programming HW1<br></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/96/three.min.js"></script>
<script src="https://threejs.org/examples/js/controls/OrbitControls.js">
</script>
<script src="https://code.jquery.com/jquery-2.1.4.min.js">
</script>
<script src="https://rawgit.com/jyunming-chen/tutsplus/master/js/KeyboardState.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/stats.js/r16/Stats.min.js"></script>
<script src="https://threejs.org/examples/js/controls/OrbitControls.js">
</script>
CSS
body {
overflow: hidden;
}
JavaScript
var renderer, scene, camera, controls;
var angle = 0;
var triangle, building;
var keyboard = new KeyboardState();
var stats;
window.addEventListener('resize', onWindowResize, false);
function initHUD() {
// sceneHUD: a simple line boundary
sceneHUD = new THREE.Scene();
cameraHUD1 = new THREE.OrthographicCamera(-10.5, 10.5, 10.5, -10.5, -50, 50);
cameraHUD1.position.z = 20; // for border
cameraHUD2 = new THREE.OrthographicCamera(-260, 260, 260, -260, -260, 260);
cameraHUD2.position.set(0, 30, 0)
cameraHUD2.up.set(0, 0, -1) // for top view
cameraHUD2.lookAt(new THREE.Vector3())
var lineGeometry = new THREE.Geometry();
lineGeometry.vertices.push(new THREE.Vector3(-10, -10, 0),
new THREE.Vector3(10, -10, 0),
new THREE.Vector3(10, 10, 0),
new THREE.Vector3(-10, 10, 0),
new THREE.Vector3(-10, -10, 0));
var line = new THREE.Line(lineGeometry,
new THREE.LineBasicMaterial({
color: 0xffffff
}));
sceneHUD.add(line);
}
class buildTriangle {
constructor() {
let texture = loader.load("https://i.imgur.com/DrvlmNW.jpg");
var geometry = new THREE.Geometry();
geometry.vertices.push(
new THREE.Vector3(30, 0, 0),
new THREE.Vector3(0, 0, 10),
new THREE.Vector3(0, 0, -10),
new THREE.Vector3(0, 10, 0)
);
var face;
face = new THREE.Face3(0, 3, 1);
geometry.faces.push(face);
face = new THREE.Face3(0, 2, 3);
geometry.faces.push(face);
face = new THREE.Face3(0, 1, 2);
geometry.faces.push(face);
face = new THREE.Face3(1, 3, 2);
geometry.faces.push(face);
geometry.faceVertexUvs[0].push([new THREE.Vector2(1, 0.5), new THREE.Vector2(0.25, 0.5), new THREE.Vector2(0.25, 0.25)]);
geometry.faceVertexUvs[0].push([new THREE.Vector2(1, 0.5), new THREE.Vector2(0.25, 0.75), new THREE.Vector2(0.25, 0.5)]);
geometry.faceVertexUvs[0].push([new THREE.Vector2(1, 0.5), new THREE.Vector2(0.25, 0.25), new THREE.Vector2(0.25, 0.5)]);
...