O . K . I finally got there…
Array seems good…
Now i need to map them into the previous thing…
This is really visible progress which may lead to the final success
hahaha *needless to say i feel so stupid haha. Update: that “:any” thing worked once again sort of
I’ve noticed the original is a Float32Array:
How do i get the ConsLog #1 data out of there in the correct format?
Should “: any” at L:173 be set to something else to declare an Array?
As far as I can see your ConsLog #2 is outside a function which will be performed only after the image is loaded. That is why you have 0’s there. You need a callback or promise here, for example.
As for the line 173 you may try myInstance:MyArrayType[] = [];
See also TypeScript Array Type
Ah… okay…so that works! I just had to put the log back into the function…
So now, I need to make sure the Thin Instance creation occurs only after this Array has been created…
please tell me I’ve not spent days for nothing [actually crying inside]
The playgrounds are broken though… *i’m going to keep going haha I’m so close… I think i need an Async function!
Yeah – I’ve learned a bit i think
Annnnd I’ve just now broken everything with my Async function…
async function makePxls() {
await img.onload;
console.log("Log async: ", dynColorData);
for (var x = 0; x < numPerX; x++) {
m.m[12] = -screenWtot / 2 + ofstX * x;
for (var y = 0; y < numPerY; y++) {
m.m[13] = -screenHtot / 2 + ofstY * y;
for (var z = 0; z < numPerZ; z++) {
m.m[14] = -pxlsize;
// m.m[14] = -screenDtot / 2 + ofstZ * z;
m.copyToArray(pxlMatrixData, index * 16);
pxlColorData[index * imgResFactor + 0] = dynColorData[index * imgResFactor + 0];
pxlColorData[index * imgResFactor + 1] = dynColorData[index * imgResFactor + 1];
pxlColorData[index * imgResFactor + 2] = dynColorData[index * imgResFactor + 2];
pxlColorData[index * imgResFactor + 3] = 1.0;
// var coli = Math.floor(col);
// pxlColorData[index * 4 + 0] = ((coli & 0xff0000) >> 16) / 255;
// pxlColorData[index * 4 + 1] = ((coli & 0x00ff00) >> 8) / 255;
// pxlColorData[index * 4 + 2] = ((coli & 0x0000ff) >> 8) / 255;
// pxlColorData[index * 4 + 3] = 1.0;
index++;
col += 0xffffff / PXLinstanceCount;
}
}
}
pixels.thinInstanceSetBuffer("matrix", pxlMatrixData, 16, false);
pixels.thinInstanceSetBuffer("color", pxlColorData, 4, false);
const pxlMat: any = new BABYLON.StandardMaterial("material", this._scene);
pxlMat.disableLighting = true;
pxlMat.emissiveColor = BABYLON.Color3.White();
pixels.material = pxlMat;
}
makePxls();
How does one wait for this function to complete,
I must have wrong syntax isn’t it…
Yep, backwards compatibility was broken in BJS5 so here is the updated PG:
O M G . Is this what i could have followed from the get go!?
Darn it… haha
…off to compare and contrast this code
The img.onload
is a callback. You can’t await
it. You can do this:
img.onload = function() {
// your existing img.onload code
processImage()
}
function processImage() {
console.log("Log async: ", dynColorData);
for (var x = 0; x < numPerX; x++) {
m.m[12] = -screenWtot / 2 + ofstX * x;
for (var y = 0; y < numPerY; y++) {
m.m[13] = -screenHtot / 2 + ofstY * y;
.
.
.
}
Or you can use an async wrapper. Google it, stackoverflow.com has tons of examples.
For example:
Do you know what this
means in this context?
ummmm… No I don’t think I do… All of this is being called within the scene constructor “_scene”, including the callback, which consequently triggers this function…
Does it require more specificity because it is being called from within the callback or something? …it therefore loses the context of the “this.” code ??
ummm . Okay… lets see if i get this…