Isometric

Developer
Neviton
Size
26,502 Kb
Views
18,216
  1. Isometric Previews
  2. Isometric HTML Codes
  3. Isometric CSS Codes
  4. Isometric JS Codes

How do I make an isometric?

What is a isometric? How do you make a isometric? This script and codes were developed by Neviton on 25 November 2022, Friday.

Isometric Previews
IQ Test

Isometric - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Isometric</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <canvas id="mapCanvas" width="1400" height="800"></canvas>
<div class="tile grass"></div>
<i class="box"> <i class="top"></i> <i class="left"></i> <i class="right"></i>
</i> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Isometric - Script Codes CSS Codes

body { margin: 0; padding: 0; background-color: #000;
}
body * { box-sizing: border-box;
}
canvas { width: 100%;
}
.box { display: block; position: absolute; z-index: 100;
}
.box i { display: block;
}
.box .top { z-index: 101; width: 100%; height: 100%; position: absolute; top: 0; left: 0; transform: rotateX(60deg) rotateZ(45deg); background-color: currentColor;
}
.box .left,
.box .right { width: 70%; height: 74%; position: absolute; top: 67%; background-color: currentColor;
}
.box .left { left: -20%; transform: skewY(26.5deg); box-shadow: inset 100px 100px 0 rgba(0, 0, 0, 0.2);
}
.box .right { right: -20%; transform: skewY(-26.5deg); box-shadow: inset 100px 100px 0 rgba(0, 0, 0, 0.4);
}

Isometric - Script Codes JS Codes

var canvas = document.getElementById('mapCanvas'), context = canvas.getContext('2d'), tiles = { ground: { base64: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIQAAABjCAYAAABaBaidAAADHUlEQVR42u3cPWtTURzH8SsODg4OvghdxUnURKkKglWbklqSSK6bRZx8QkybGi2tTa2DTiKIoqkURCkaEgdfhbujW6cOblcrWgJtJUlz7/0/fH/w5eyHD2c8QcCC5vWze5bz+d3chPMtz+X3NeuF8fajUrNVLz1tzo4fAoZnCPOlr+168eeXhcvReq164QcwgLApYAABGEDoPmAAARhAAAYQgAEEYAABGEAABhCAAQRgAEF1wAACMIAADCAAAwjAAAIwgAAMIAADCMAAAjCAAAwgAAMIwEgQBhCAAQRgAAEYQAAGEICxLQwgAGMDxseZsZOt+SIQnMP48PDSk2fXhvYHS1O5xfe1sejzXCFq10tckLM+zRaiV3cvRAtXh1Zr5WOHg7eV3OLS5Gj0bmo0AoZDCBOnolqYjarl46uTnSD+BQxfEO6HmT9tCwIYviB0DQIYPiD0DAIYtiH0DQIYNiHsGAQwbEEYGAhgyIPQK4JYQABD54sQOwhg6IQQOwhg6IKQGAhg6ICQOAhgyIaQGghgyISQOghgyIIgBgQwZEAQB8IrDCkQxILwAkMaBPEgrMKQCkENCCswpENQB0IrDC0Q1ILQAkMbBPUgpMLQCsEMCCkwtEMwByItGFYgmAWRFAxrEMyDiAuGVQhuQAwKhnUI7kD0C8MLBLcguoXhDcImEI1K7kajMrLmCcVWMLxC6ADxrVI8eiB4ffPM3jeVi+ca90ZWvMJYPx9PnHYJYbqc+V4NM9PV8MjBIAh2bXwr5BnGyzvnowdXskDYah5heALRNQTPMDyA6BuCRxiWQQwMgicYFkHEBsEDDEsgEoNgGYYFEKlBsAhDMwgxECzB0AhCLAQLMDSBUANBMwwNINRC0AhDMggzEDTBkAjCLAQNMCSBcANBMgwJINxCkAgjTRBAEAgjDRBAEAwjSRBAUAAjCRBAUAQjThBAUAgjDhBAUAxjkCCAYADGIEAAwRCMnYAAgkEY/YAAgmEYvYAAggMY3YAAgiMY/wMBBIcwtgIBBMcwOkEAARgrL24Pr9VCILC/MJ7fGs5WwxNA+L1fOajj7A08YfsAAAAtdEVYdFNvZnR3YXJlAGJ5LmJsb29kZHkuY3J5cHRvLmltYWdlLlBORzI0RW5jb2RlcqgGf+4AAAAASUVORK5CYII=' }, grass: { base64: 'data:image/png;base64,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' }, grassGround: { base64: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIQAAABjCAYAAABaBaidAAAFTUlEQVR42u3cTW8TRxgH8JV65MKl5/ack1N6QFWc7ChR0lYRJSAuIJG0IuqxoqRFdD1OIrXhVeKAhAjCiIQQIJUQL+21V8Qn6DdIP0B7q9RpAtiJvfPyTDyz3tn5rzSyE9s5xL/855lnxkkSXMnC+uShU1vJB/hNRH6tbNU/vPJqav7qb5//cfXV1K3LLyaGASNuCG92xr/Xfv9C7I6d+38BBiDkBmAAAmAAAn0ABiAABiAABiAABiAABiAABiAABiAABiAABiAEPQADEAADEAADEAADEAADEAADEAADEAADEAADEAADEAADEAADEACjQBiAABiAABiAABiAABiAABhKGIAAGB0Yy79OfLXyYgoQIoex/HT8xtzN2uEkWx9rLT0ZFyvPJ3cfwC8osvHzs0mxsDoi5leObJ+5NDSUZA/GWo2HqWg8ZAIwYoTwqZht1sRZXtsPgon9AzDigdAeEhBpzwCMGCBYgQCM6kNQgEgVIBgSo2oQ+PthSohsvRcCk6AAjOATgQZClQ4qGDv3NwAjOAi6KaNRyy87ddOFLCkAI5wawTR6QDBFOpgSY9/zAKN8ELgFCE4CwUg1BaaS8BKhF42iMWWRCDtjrxDtXqYCRgAQ7EDI/vpVtUSqSQ9MJaWFYJ4yTCBkj5vgMCSGKwi8vwQwrjLMjSndG0xZpqaSWyRGIYnA7QF1Vhm/3J1oNdeoCUGdMkzJgk00r1MDt3/+1xeHt7+9MDyUbDRnWveuHRPXV6fEOximesH0RqcWKxR0PouqEVQQ5i8dEd9/d1Q0vhnZXjxTH0oeZTOtx/yk2Fw8IfIwmL4pRS5Gu8fu6iSLPDHIELhfCPxcXSzPjYrF2Xo3iPaQwzhosakAoXu84jVGWRKhDaE9lCBoMJi5pS2tJyijmtvuB4LAHSWEBgIZhB6GqYCkFqOE1Ak8MfpKBO4CwidaCNYg1DAYsTml2hupdmL0PTVwv4nQN4iD1xgpYeeU0hkNYxOtrDWCNxB2MGxSwLYeKRcMZxBkdQP3B8EZCHONkVovR837Jqx0DS7X29BWr7WoEQoDQSs+9YVl964p9ZBOPj2KhCGFwD2sFrjk5zhIBO8g6DDyX2dWCcH0y17PNYa3qYG7XTWUBoRdHyO1XI5aPO4YhvYUs+8NKA+JUDgIexip5RtPqTH6h+F11cAHD6FwEO3xSNrHoO+D5Pc/UuUU5AKG1V6DgwZS7/RRFISBgaAnBhP25zMIHxsgHtSxTgTuMC0GACEPonGCbzZm/ikShQpGdwpQ6gxmLFjb38sMHx8gf8CFe8AxQAjvMfy3NFt/nZ3+7KNkfWHy0Ebj+PRmNvOyLDDoaaHaW2EW5zmY+GktlUPgHrafefextsFDGP2zOVs/vzh39OOufytUThh7t/leBSMezkmNJ7l+uFvXr/09gCgthN6rfDCIqwkjBvXrciCaNfft52ZgEMKEYQtC/hotCBc1g8eGkncI5Ydhc/yfNsU4Swiev60MhDBgULfZ9afFnU4ZvOIQQoChb1qZP0LwFgQ3bE7FNjVUMzFoBWgnIYLuIwwIQiiJQT++JwHBAaGiiZHmO5SSxND2IQChWjAywulucmMq5hqhqokhW3l0ikqsGmKGQehUAkKcMGRFJSBEDGN/HwLFImCIi3dGkQiAsQfj9tKXgAAYe+P+j8cAATCKBwEIgcDwDQIQAoPhCwQgBArDNQhACByGKxCAUBEY/YIAhIrBOCgIQKgoDFsQgFBxGFQQgBAJDBMIQIgMhgoEIEQKoxcEIEQOow0CEADjLYx7C9N/AwKuDozVC9MjgPDu+h/GkFyjW1DjIAAAAC10RVh0U29mdHdhcmUAYnkuYmxvb2RkeS5jcnlwdG8uaW1hZ2UuUE5HMjRFbmNvZGVyqAZ/7gAAAABJRU5ErkJggg==' }, water: { base64: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIQAAABTCAYAAABef68wAAACcklEQVR42u3aPy8DYQDH8YtZd4PJbBWLMkpIJK1FCEpERCwIBpUjiFRiQmm1GknV0lkYRCwiBkmPES3egpjIIyrqTzVKr6fPPd9f8n0DTz65e4ZH05i2enhRrut6GSehOoTTZEXASA0FjdRRIJFaWktcVgNDYQgB4/psw7h5DF3cipc2jOQdMICQFTCAAAwg5B8wgAAMIAADCMAAAjCAAAwgAAMIwAACMIAgdcAAAjCAAAwgAAMIwAACMIAADCAAAwjAAAIwgAAMIAADCMCwEAYQgAEEYAABGEAABhCAkRMGEICRgRHZ3W8LnV0CQXEYK4cnsz6fz6FF5/vj0S2/iBydiLCR5ICU6kasHyfE0mZEzE4MXOk9dVVabNIV35lqFTtzvSK6tQYMxSDMjfWJGU+DmO50XuntH0G8BQylIMx46tPlBgEMpSDkDwIYSkD4PQhg2BrC30EAw5YQCgcBDFtBMA8EMGwBwXwQGRg9wJAQQvFA8MWQEkLxQQBDKgjWgQCGFBCsBwGMkobwfyCAUZIQskF4XYsxr/vBUhTAKBkIaQzdzqfpLueB7qmp0MLjLY5tr8sdm3TvAUNBCN3153pX3aDeUVv56RkdMIDw7YABBGAAARhAKHDAAAIwgAAMIAADCMAAAjCAAAzzYAABGEAABhCAAQRgZMMIJa6BAIx3GMHlBSAA473AaDMQgGE9CCBIAiNYZBBAkAxGsUAAQVIYZoMAguQwzAIBBJvAKPRSCQSbwfgrCCDYFMZvfxlAsDmMfEEAQREYP4EAgmIwcoEAgqIwvl4qgaA4jDcQQABGGoZ/pOkeCCwDwz/c6ATC654BrFfUZyyJYagAAAAtdEVYdFNvZnR3YXJlAGJ5LmJsb29kZHkuY3J5cHRvLmltYWdlLlBORzI0RW5jb2RlcqgGf+4AAAAASUVORK5CYII=' }, waterTopLeft: { base64: 'data:image/png;base64,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' }, waterTopRight: { base64: 'data:image/png;base64,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' }, waterBottomRight: { base64: 'data:image/png;base64,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' // base64: 'data:image/png;base64,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' }, waterBottomLeft: { base64: 'data:image/png;base64,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' } }, i = 0;
for (tileType in tiles) { var tile = tiles[tileType]; tile.image = new Image(); // tile.image.onload = function() { // context.drawImage(this, i, 0); // i += 132; // } tile.image.src = tile.base64; // context.drawImage(tile.image, i, 0); i += 132;
}
// 218 ┌
// 191 ┐
// 217 ┘
// 192 └
var map = [ [ '#########', '##OOOOO##', '#OOOOOOO#', '#OO┌ ┐OO#', '#OOOOOOO#', '#OO└ ┘OO#', '#OOOOOOO#', '##OOOOO##', '#########' ] // [ // '#########', // '##XX#XX##', // '#XXX XXX#', // '#XXX XXX#', // '#XXX XXX#', // '#XXX XXX#', // '#XXX XXX#', // '##XX#XX##', // '#########' // ], // [ // '#XXXXXXX#', // 'XXXXXXXXX', // 'XXXXXXXXX', // 'XXXXXXXXX', // 'XXXXXXXXX', // 'XXXXXXXXX', // 'XXXXXXXXX', // 'XXXXXXXXX', // '#XXXXXXX#' // ], // [], // [], // [ // 'XXXXXXXXX', // 'XXXXXXXXX', // 'XXXXXXXXX', // 'XXXXXXXXX', // 'XXXXXXXXX', // 'XXXXXXXXX', // 'XXXXXXXXX', // 'XXXXX*XXX', // 'XXXXXXXXX' // ], ], mapSize = { width: map[0][0].length, height: map[0].length }, css = { width: 40, height: 40 }, boxDiameter = Math.sqrt(2*(css.width*css.width)), tile = { // width: boxDiameter, // height: boxDiameter / 2 width: 132, height: 66 }, dx = Math.floor(tile.width / 2), dy = Math.floor(tile.height / 2), dz = 0, x, y, tileTemplate = '<i class="box"><i class="top"></i><i class="left"></i><i class="right"></i></i>';
//14x8
function topDownToIso(coord) { return { x: coord.x - coord.y, y: coord.y + coord.x };
}
for (z = 0; z < map.length; z++) {  for (y = 0; map[z].length && y < mapSize.height; y++) {  for (x = 0; x < mapSize.width; x++) { var $dot = $(tileTemplate), // $dot = $('<div><div></div></div>'), coordIso = topDownToIso({x: x, y: y}), tileType = null, xTile = coordIso.x * dx + (mapSize.width * dx), yTile = coordIso.y * dy - dz; switch(map[z][y][x]) { case 'O': tileType = 'blue'; context.drawImage(tiles.water.image, xTile, yTile); break; case '#': tileType = 'green'; context.drawImage(tiles.grass.image, xTile, yTile); break; case '@': tileType = 'silver'; context.drawImage(tiles.ground.image, xTile, yTile); break; case '┌': // tileType = 'silver'; context.drawImage(tiles.waterTopLeft.image, xTile, yTile); break; case '┐': // tileType = 'silver'; context.drawImage(tiles.waterTopRight.image, xTile, yTile); break; case '└': // tileType = 'silver'; context.drawImage(tiles.waterBottomLeft.image, xTile, yTile); break; case '┘': // tileType = 'silver'; context.drawImage(tiles.waterBottomRight.image, xTile, yTile); break; case '*': tileType = 'white'; context.drawImage(tiles.grassGround.image, xTile, yTile); }
// if (tileType) {
// $dot.css({
// width: css.width,
// height: css.height,
// top: coordIso.y * dy - dz + 100, // padding=100
// left: coordIso.x * dx + (mapSize.width * dx),
// zIndex: z,
// color: tileType
// });
// $('body').append($dot);
// } } } dz += tile.height;
}
// imageObj.src = 'https://www.html5canvastutorials.com/demos/assets/darth-vader.jpg';
// setInterval(function() {
// $('div > div').each(function(){
// $(this).css({
// backgroundColor: 'rgba(' + Math.round(Math.random() * 255) + ', 0, 0, 1)'
// });
// });
// }, 100);
Isometric - Script Codes
Isometric - Script Codes
Home Page Home
Developer Neviton
Username nevitones
Uploaded November 25, 2022
Rating 3
Size 26,502 Kb
Views 18,216
Do you need developer help for Isometric?

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!

Neviton (nevitones) Script Codes
Name
Allow flex items to wrap
Class Scope self tests
Slick Carousel Sync BUG
Canvas funny lines
Line Height - unitless VS em
Playing with Canvas
Slick Carousel Sync
Flex Study
D3 - Study 1
Codepen API test
Create amazing marketing copy 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!