r/diversions
1
0
Fork 0
Code Pull requests Releases Activity

plane size depends on image size (factor 100)

Browse source
This commit is contained in:
Ruben van de Ven 2020-06-19 17:50:50 +02:00
parent 1819b35404
commit c4ce456af0
1 changed files with 25 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
parade.js
View file

@ -413,10 +413,18 @@ class ParadeImage {
makeMesh(scene, config) { makeMesh(scene, config) {
this.mesh = new BABYLON.TransformNode(); this.mesh = new BABYLON.TransformNode();
var img = new Image();
let self = this; // use in callback
img.onload = function() {
// we preload the image, so we can create the plane based on image dimensions
// see https://www.html5gamedevs.com/topic/8917-textures-source-image-aspect-ratio/?do=findComment&comment=52949
var planeOptions = { var planeOptions = {
// TODO: should size be dynamic? // TODO: should size be dynamic?
height: 5.4762, height: this.height/100,
width: 7.3967, width: this.width/100,
sideOrientation: BABYLON.Mesh.DOUBLESIDE // texture should be visible from front and back sideOrientation: BABYLON.Mesh.DOUBLESIDE // texture should be visible from front and back
}; };
@ -424,11 +432,14 @@ class ParadeImage {
var imageMat = new BABYLON.StandardMaterial("m", scene); var imageMat = new BABYLON.StandardMaterial("m", scene);
imageMat.diffuseTexture = new BABYLON.Texture(this.getImageUrl(), scene); imageMat.diffuseTexture = new BABYLON.Texture(self.getImageUrl(), scene);
imageMat.roughness = 1; imageMat.roughness = 1;
imageMat.emissiveColor = new BABYLON.Color3.White(); imageMat.emissiveColor = new BABYLON.Color3.White();
imagePlane.material = imageMat; imagePlane.material = imageMat;
imagePlane.parent = this.mesh; imagePlane.parent = self.mesh;
}
img.src = this.getImageUrl();
// text https://www.babylonjs-playground.com/#TMHF80 // text https://www.babylonjs-playground.com/#TMHF80
// TODO: cleanup this mess of the dynamic texture: // TODO: cleanup this mess of the dynamic texture: