Skip to content

Instantly share code, notes, and snippets.

@davestevens

davestevens/index.html

Last active September 21, 2020 08:13
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save davestevens/cb7b29688a8c12c44cd1610a5ba45183 to your computer and use it in GitHub Desktop.
Save davestevens/cb7b29688a8c12c44cd1610a5ba45183 to your computer and use it in GitHub Desktop.
Download ZIP
Render a DDS to HTMLImageElement
Raw
index.html
<!DOCTYPE html>
<html>
<head> </head>
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r120/three.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/three-addons@1.2.0/build/three-addons.min.js"></script>
<script>
const loader = new THREE_ADDONS.DDSLoader();
loader.load("bucket.DDS", (texture) => {
texture.wrapT = THREE.RepeatWrapping;
texture.repeat.set(1, -1);
texture.needsUpdate = true;
var renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(texture.image.width, texture.image.height);
var scene = new THREE.Scene();
scene.background = texture;
renderer.render(scene, new THREE.PerspectiveCamera());
const url = renderer.domElement.toDataURL();
const img = document.createElement("img");
img.src = url;
document.body.appendChild(img);
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment