Diamond-Square Terrain II

Developer
Andrey Shchekin
Size
2,928 Kb
Views
16,192
  1. Diamond-Square Terrain II Previews
  2. Diamond-Square Terrain II HTML Codes
  3. Diamond-Square Terrain II CSS Codes
  4. Diamond-Square Terrain II JS Codes

How do I make an diamond-square terrain ii?

Now the algorithm is correct.. What is a diamond-square terrain ii? How do you make a diamond-square terrain ii? This script and codes were developed by Andrey Shchekin on 15 November 2022, Tuesday.

Diamond-Square Terrain II Previews
IQ Test

Diamond-Square Terrain II - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Diamond-Square Terrain II</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div id="container"></div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='http://cdnjs.cloudflare.com/ajax/libs/three.js/r58/three.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Diamond-Square Terrain II - Script Codes CSS Codes

html, body, #container { width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;
}

Diamond-Square Terrain II - Script Codes JS Codes

// Note: This is just my attempt to understanding how to do this.
// If you want a proper implementation, use https://github.com/qiao/fractal-terrain-generator
var Generator = function(segmentCount, zScaleStart, zScaleReduction) { var geometry; function initGeometry(size) { geometry = new THREE.PlaneGeometry(size, size, segmentCount, segmentCount); return geometry; }; function getVertexZAverage() { var sum = 0; for (var i = 0; i < arguments.length; i++) { sum += getVertexZ(arguments[i][0], arguments[i][1]); } return sum / arguments.length; }; function generateVertexZ(x, y, average, zScale) { var vertex = geometry.vertices[(y*(segmentCount + 1)) + x]; vertex.z = (average + zScale * (Math.random() - 0.5)); geometry.verticesNeedUpdate = true; }; function getVertexZ(x, y) { var vertex = geometry.vertices[(y*(segmentCount + 1)) + x]; return vertex ? vertex.z : 0; }; function diamondSquareStep(square, zScale, next) { function diamond(centerX, centerY, half) { var average = getVertexZAverage([centerX - half, centerY], [centerX + half, centerY], [centerX, centerY - half], [centerX, centerY + half]); generateVertexZ(centerX, centerY, average, zScale); } var half = (square.x2 - square.x1) / 2; var centerX = square.x1 + half; var centerY = square.y1 + half; var average = getVertexZAverage([square.x1, square.y1], [square.x2, square.y1], [square.x1, square.y2], [square.x2, square.y2]); generateVertexZ(centerX, centerY, average, zScale); diamond(square.x1, centerY, half); diamond(square.x2, centerY, half); diamond(centerX, square.y1, half); diamond(centerX, square.y2, half); if (half === 1) return; next.push({x1: square.x1, x2: centerX, y1: square.y1, y2: centerY}); next.push({x1: square.x1, x2: centerX, y1: centerY, y2: square.y2}); next.push({x1: centerX, x2: square.x2, y1: square.y1, y2: centerY}); next.push({x1: centerX, x2: square.x2, y1: centerY, y2: square.y2}); } var zScaleCurrent = zScaleStart; var squares = [{x1: 0, y1: 0, x2: segmentCount, y2: segmentCount}]; function generateNextStep() { var newSquares = []; for (var i = 0; i < squares.length; i++) { diamondSquareStep(squares[i], zScaleCurrent, newSquares); } squares = newSquares; zScaleCurrent /= zScaleReduction; return squares.length > 0; } return { initGeometry : initGeometry, generateNextStep : generateNextStep };
}
var generator = new Generator(64, 150, 2);
function main() { var $container = $('#container'); var width = $container.width(); var height = $container.height(); var renderer = new THREE.WebGLRenderer({ antialias: true }); var camera = new THREE.PerspectiveCamera(45, width / height, 0.1, 10000); var scene = new THREE.Scene(); camera.position.z = 400; camera.position.y = -80; renderer.setSize(width, height); $container.append(renderer.domElement); // create the mesh's material var meshMaterial = new THREE.MeshBasicMaterial({ color : 0x000000, wireframe : true }); var geometry = generator.initGeometry(400); geometry.dynamic = true; var mesh = new THREE.Mesh(geometry, meshMaterial); mesh.rotation.x = 2.25; // add the mesh to the scene scene.add(mesh); scene.add(camera); (function generate() { if (generator.generateNextStep()) setTimeout(generate, 500); })(); (function rotate() { mesh.rotation.z += 0.002; setTimeout(rotate, 10); })(); (function draw() { renderer.render(scene, camera); requestAnimationFrame(draw); })();
}
// height bug fix
setTimeout(main, 10);
Diamond-Square Terrain II - Script Codes
Diamond-Square Terrain II - Script Codes
Home Page Home
Developer Andrey Shchekin
Username ashmind
Uploaded November 15, 2022
Rating 4
Size 2,928 Kb
Views 16,192
Do you need developer help for Diamond-Square Terrain II?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Andrey Shchekin (ashmind) Script Codes
Name
CSS
TV Fall
Diamond-Square Terrain
Text Effect 1
Code Loader
Labyrinth 1
Text Effect 2.1
A Pen by Andrey Shchekin
Hexagons
JQuery visiblechange event
Create amazing video scripts with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!