@spearwolf/twopoint5d
Version:
Create 2.5D realtime graphics and pixelart with WebGL and three.js
34 lines • 1.9 kB
JavaScript
import { add, attribute, cameraPosition, cross, div, float, mod, modelViewMatrix, mul, normalize, sub, texture, varying, vec2, vec3, } from 'three/tsl';
export const vertexByInstancePosition = (params) => {
const position = params?.vertexPosition ?? attribute('position');
const instancePosition = params?.instancePosition ?? attribute('instancePosition');
const scale = params?.scale;
if (scale) {
return add(mul(position, scale), instancePosition);
}
else {
return add(position, instancePosition);
}
};
export const billboardVertexByInstancePosition = (params) => {
const billboardPosition = params?.instancePosition ?? attribute('instancePosition');
const billboardSize = params?.scale ?? attribute('quadSize');
const vertexPosition = params?.vertexPosition ?? attribute('position');
const look = normalize(sub(cameraPosition, billboardPosition));
const cameraUp = vec3(modelViewMatrix[0].y, modelViewMatrix[1].y, modelViewMatrix[2].y);
const billboardRight = normalize(cross(cameraUp, look));
const billboardUp = normalize(cross(look, billboardRight));
return add(billboardPosition, add(mul(billboardRight, mul(vertexPosition.x, billboardSize.x)), mul(billboardUp, mul(vertexPosition.y, billboardSize.y))));
};
export const colorFromTextureByTexCoords = (colorMap, params) => {
const texCoords = params?.texCoords ?? attribute('texCoords');
const uv = params?.uv ?? attribute('uv');
const vTexCoords = varying(vec2(add(texCoords.xy, mul(uv.xy, texCoords.zw))));
return texture(colorMap, vTexCoords);
};
export const texCoordsFromIndex = (mapSize, ndx) => {
const column = mod(ndx.toInt().toFloat(), mapSize.x.toFloat()).toInt();
const row = div(ndx, mapSize.x.toInt()).toInt();
return div(add(vec2(column, row), float(0.5)), vec2(mapSize.x, mapSize.y));
};
//# sourceMappingURL=node-utils.js.map