Using THREE.RGBAFormat instead of THREE.RGBFormat

The RGBFormat has been removed in favor of using the RGBAFormat.
https://github.com/mrdoob/three.js/pull/23228

I previously did things like this:

var count = vectorData.length;
var data = new Float32Array(count * 3);
var index;
for (i = 0; i < count; i++) {
    index = 3 * i;

    data[index + 0] = vectorData[i].x;
    data[index + 1] = vectorData[i].y;
    data[index + 2] = vectorData[i].z;
}
myDataTexture = new THREE.DataTexture(data, count, 1, THREE.RGBFormat, THREE.FloatType);  

Do I understand correctly that now Iā€™m supposed to do it like this:

var count = vectorData.length;
var data = new Float32Array(count * **4**);
var index;
for (i = 0; i < count; i++) {
    index = **4** * i;

    data[index + 0] = vectorData[i].x;
    data[index + 1] = vectorData[i].y;
    data[index + 2] = vectorData[i].z;
    data[index + 3] = **[some arbitray number]**;
}
myDataTexture = new THREE.DataTexture(data, count, 1, **THREE.RGBAFormat**, THREE.FloatType);  

Basically just ask for a larger array to store the data and pad every fourth element with some arbitrary, never to be used values?

I would use ā€œ1ā€ (or 255 for byte arrays) instead of some arbitrary number for alpha depending on how it is used since I believe that was the implicit alpha value for textures before.

3 Likes

Alright. Thank you! :slight_smile:
Iā€™m not actually using that value anywhere at all (I only need 3 floats per texel). But if it automatically used to be ā€œ1ā€ before, I guess assigning ā€œ1ā€ makes sense.

Basically just ask for a larger array to store the data and pad every fourth element with some arbitrary, never to be used values?

Worth noting that the extra padding would be added behind the scenes in many devices anyway, within the WebGL implementation. We consider it better practice (and better for performance) to use RGBA.

1 Like