threejs ShapeGeometry 自定义贴图的uv坐标

问题描述:

由于一些原因,要绘制一个长方形,但是这个长方形并不是 PlaneGeometry,而是一个ShapeGeometry。但是同样的贴图,同样的形状,贴图贴在PlaneGeometry上时可以正常显示,但是贴在ShapeGeometry中却不可以正常显示。所以判断是贴图uv坐标问题。

问题排查:

PlaneGeometry默认顶点坐标和uv坐标对应关系如下,其中点1,2,3,4为geometry的vertex顺序

ShapeGeometry默认顶点坐标和uv坐标对应关系如下:

我们看到,uv是这样的,和他的顶点坐标是一致的,但是实际上,我们希望uv的对应关系和PlaneGeometry是一致的。所以我们手动修改uv和顶点的对应关系

解决办法:

javascript 复制代码
const uvs = [];

uvs.push(0, 1);
uvs.push(1, 1);
uvs.push(1, 0);
uvs.push(0, 0);

groud.geometry.setAttribute('uv', new THREE.Float32BufferAttribute(new Float32Array(uvs), 2));
groud.geometry.getAttribute('uv').needsUpdate = true;
相关推荐
玖石书1 天前
python-uv-windows环境安装方案
windows·python·uv
常山云栈2 天前
Anaconda和uv的区别是什么?
python·anaconda·uv
像我这样帅的人丶你还3 天前
📱iPhone Duo 开屏动画咋实现的?
javascript·webgl·three.js
夏天要喝冰可乐3 天前
Antigravity + Blender MCP(下):3D 智慧仓储数字孪生进阶实战
前端·webgl·three.js
夏天要喝冰可乐3 天前
Antigravity + Blender MCP(上):打造3D 智慧仓储数字孪生
前端·webgl·three.js
魔士于安8 天前
unity 丑陋哥布林 哥布林有humannoid 动画没 带动画
unity·游戏引擎·材质·贴图·模型
supermapsupport9 天前
SuperMap iClient3D for WebGL 交互式栅格信息查询
webgl·supermap
H Journey9 天前
pip 和uv 开发和部署python项目
python·pip·uv
梦想不只是梦与想10 天前
环境管理:Conda 与 venv
python·conda·uv
八荒启·交互动画11 天前
# Web特效020—让 Web 特效真正动起来:时间循环应该怎么接
前端·webgl·网页特效·八荒启-交互动画·八荒启