KITASENJU DESIGN BLOG

memo, html, javascript, unity

パラメーターをシェーダーにDataTextureで渡す

import * as THREE from 'three';
import { DataTexture, Vector2 } from 'three';

export class ParamTexture{

    public dataTex:DataTexture;
    public size:THREE.Vector2;

    constructor() 
    {
        let ruleTexWidth = 32;
        this.size = new Vector2(ruleTexWidth,ruleTexWidth);

        let len = ruleTexWidth*ruleTexWidth;
        var data = new Float32Array(len*4);

        let ruleList = [
            /*
             1,2,3,4,5,6,7,8,9
            */
            //SurviveとBirth
            [
                0.5,//this._dA = 0.5;
                0.342,//this._dB = 0.342;
                0.037,//this._f = 0.037;
                0.059//this._k = 0.059;
            ],
            [
                0.21,//this._dA
                0.105,//this._dB
                0.015,//this._f                
                0.049//this._k
            ]
        ];

        for(let j=0; j<ruleTexWidth; j++){
            for (let i = 0; i < ruleTexWidth; i++) {

                let stride = (j*ruleTexWidth+i) * 4;

                if(j<ruleList.length && i<ruleList[0].length){
                    let value   = ruleList[j][i];
                    if(!value) value=0;
                        
                    data[stride] = value;//Math.random();
                    data[stride + 1] = 0;
                    data[stride + 2] = 0;
                    data[stride + 3] = 1;    
                }else{

                    data[stride] = 0;//Math.random();
                    data[stride + 1] = 0;
                    data[stride + 2] = 0;
                    data[stride + 3] = 0;  
                }
            }
          }  
          
        var ruleTex = new THREE.DataTexture( 
            data, ruleTexWidth, ruleTexWidth, THREE.RGBAFormat, THREE.FloatType
        );

        ruleTex.minFilter = THREE.NearestFilter;
        ruleTex.magFilter = THREE.NearestFilter;
        ruleTex.needsUpdate = true;//必ず必要

        this.dataTex = ruleTex;

    }




}

シェーダー側

         float getParam(float param,float idx){

            return texture2D(
                paramTex,
                vec2(param/paramTexSize.x,idx/paramTexSize.y)
            ).x;

        }
"FOOTER"