webgl相关内容

对象的着色器线框

我想看到一个没有对角线的对象的线框 目前,我根据顶点添加线,问题是在我有几个之后我遇到了严重的性能下降. 示例此处要么对我的 Three 版本来说太新,要么不起作用(我在那里评论过). 所以我想尝试实现一个着色器. 我尝试使用这个着色器:https://stackoverflow.com/a/31610464/4279201但它坏了零件的形状,我收到 WebGL 错误. ..
发布时间:2021-11-30 19:30:19 其他开发

Three.js 无法加载纹理

我有一个带有增强现实的 Three.js 项目,现在我尝试加载一个带有纹理的模型.出于某种原因,我的模型是黑色的,我没有纹理.我检查了搅拌机中的框以导出图像,我还在 t-rex(我正在使用的模型)的 .js 文件中看到它列出了纹理,但我的应用程序不会加载它. 编辑(添加代码)我用来加载模型的代码: new THREE.JSONLoader().load("models/trex.json" ..
发布时间:2021-11-30 17:04:55 其他开发

Canvas/WebGL 2D tilemap 网格工件

我正在创建一个简单的 2D 网页游戏,可以与您的典型瓷砖地图和精灵配合使用. 问题在于我想要平滑的相机控制,包括平移和缩放(缩放). 我尝试同时使用 Canvas 2D API 和 WebGL,在两者中我都无法避免网格线失真,同时还支持正确缩放. 如果重要的话,我所有的图块的大小都是 1,并缩放到任何需要的大小,它们的所有坐标都是整数,我使用的是纹理图集. 这是使用我的 W ..
发布时间:2021-11-26 13:27:59 其他开发

我在 Three.js 中的 SpotLights 和阴影做错了

我有一个非常简单的场景,其中有一个 .dae 网格,网格下方有一个 7000*7000 的平面.我希望它被一个高的 SpotLight 照亮,这样网格就会在地面上投下阴影.但是,好像有什么东西坏了!无论我把 SpotLight 放多高,它都不会点亮飞机!此外,它只会稍微点亮网格,而它位于一个小正方形(周长)中. 你可以在这里看到情况: 只要我移动网格(怪物),它就不会再亮起来. ..
发布时间:2021-11-25 04:52:07 C#

在 WebGL 中绘制 3D 形状的第一步

我从几周开始学习 WebGL,但在绘制一些 3D 形状时遇到了问题.猜猜我正在正确计算顶点和索引,以及每个三角形的颜色,但它不起作用.有人能告诉我我做错了什么吗?我想做金字塔,它看起来像: 这是代码: var gl = null,画布 = 空,glProgram = 空,片段着色器 = 空,顶点着色器 = 空;var 坐标数组 = [ ],三角形顶点颜色 = [ ],顶点数组 = [ ..
发布时间:2021-11-25 04:44:33 C#

我在 Three.js 中的 SpotLights 和阴影做错了

我有一个非常简单的场景,其中有一个 .dae 网格,网格下方有一个 7000*7000 的平面.我希望它被一个高的 SpotLight 照亮,这样网格就会在地面上投下阴影.但是,好像有什么东西坏了!无论我把 SpotLight 放多高,它都不会点亮飞机!此外,它只会稍微点亮网格,而它位于一个小正方形(周长)中. 你可以在这里看到情况: 只要我移动网格(怪物),它就不会再亮起来. ..
发布时间:2021-11-25 04:43:26 C#

原生 WebGL 粒子系统不透明度问题

我正在尝试渲染纹理粒子,但我遇到了问题.纹理的透明像素对渲染做了一件奇怪的事情.看起来离(相机)最近的粒子根本没有渲染.但并非总是如此,其中一些正在渲染并且看起来很预期.我试图尝试使用深度和混合选项,但没有结果. 也许可以通过修改这部分代码找到解决方案. gl.enable(gl.DEPTH_TEST);gl.enable(gl.BLEND);gl.blendFunc(gl.SRC_ALP ..
发布时间:2021-11-25 04:38:19 C#

在 WebGL 中绘制 3D 形状的第一步

我从几周开始学习 WebGL,但在绘制一些 3D 形状时遇到了问题.猜猜我正在正确计算顶点和索引,以及每个三角形的颜色,但它不起作用.有人能告诉我我做错了什么吗?我想做金字塔,它看起来像: 这是代码: var gl = null,画布 = 空,glProgram = 空,片段着色器 = 空,顶点着色器 = 空;var 坐标数组 = [ ],三角形顶点颜色 = [ ],顶点数组 = [ ..
发布时间:2021-11-25 04:36:26 C#

WebGL - 使用多个纹理时的条纹

我在我的 WebGL 程序中使用了三种纹理,并且得到了条纹/重叠效果. 我绑定的第一个纹理没问题,但顺序纹理得到效果. 这是我的顶点数据格式 (x,y,z,s,t,textureIndex,textureName) -5.0 0.0 -5.0 0.0 0.0 1 WL01-5.0 0.0 5.0 0.0 1.0 1 WL015.0 0.0 5.0 1.0 1.0 1 WL01-5.0 ..
发布时间:2021-11-25 04:25:59 C#

将 Adob​​e 3D-pdf 转换为 WebGL?

有没有办法将 Adob​​e 3D-pdf 文件转换为 WebGL?我在网上搜索,但找不到方法.Adobe 3d pdf 文件的缺点是它们只能在 Internet Explorer 中直接在浏览器中查看(也许在 Safari 上 - 不知道),但是如果您使用 Firefox 或 Chrome,则需要下载文件并在杂技演员.此外,您需要激活它,有时需要调整安全设置……而 WebGL 可直接在现代浏览器 ..
发布时间:2021-11-25 04:20:18 C#

如何将客户端 .STL 文件加载到three.js 场景而不是从服务器加载?

我有一个“选择文件"按钮,我想用于加载客户端文件,而不是从第 86 行的 loader.load() 中的服务器路径加载.我猜我需要使用 File API 但没有看了这个解决方案后,不知道如何. 从第 86 行的服务器路径加载文件的现有网页: 身体 {背景色:#fea47c;}div {位置:相对;左:200像素;顶部:0像素;背景色:#eeeeee;边框:1p ..
发布时间:2021-11-25 04:19:16 C#

Threejs:将球体(地球仪)旋转到球体本身的另一个点(城市)

我正在构建一个地球(球体几何),其中包含一组预定义的地理地图位置并绘制为点(球体几何).我想通过沿 y 轴旋转地球来聚焦(将一个位置移动到另一个位置)这些位置.我尝试了以下代码,似乎不适用于所有位置. location.geometry.computeBoundingBox();var position = new THREE.Vector3();position.subVectors(loca ..
发布时间:2021-11-25 04:06:55 C#

三.js:使用自定义纹理渲染 3d 文本

我一直想知道是否可以使用加载的图像作为纹理对 3d 文本进行蒙皮?我知道你可以用立方体和其他东西来做这件事,因为大部分示例都展示了如何做的教程. 我尝试的是用三映射它.ImageUtils.loadTexture 从路径定向,但我得到的是一些透明对象.我想知道如何使用相同的概念,例如: CubeGeometry(width, height, depth, widthSegments, h ..
发布时间:2021-11-25 04:01:25 C#

如何将客户端 .STL 文件加载到three.js 场景而不是从服务器加载?

我有一个“选择文件"按钮,我想用于加载客户端文件,而不是从第 86 行的 loader.load() 中的服务器路径加载.我猜我需要使用 File API 但没有看了这个解决方案后,不知道如何. 从第 86 行的服务器路径加载文件的现有网页: 身体 {背景色:#fea47c;}div {位置:相对;左:200像素;顶部:0像素;背景色:#eeeeee;边框:1p ..
发布时间:2021-11-25 04:00:08 C#

交互式 3d 网络技术

我想在网页中使用交互式 3D 模型.所需的功能是: 导入定义 & 的 dxf 文件显示一个房间. 从 javascript 添加/移动预构建的对象 添加/移动从 javascript 投射阴影的灯 将房间尺寸返回给 javascript 将对象位置返回给 javascript 我可以将 dxf 文件导入任何 WebGL 引擎吗? 我有一个小的重复用户群,所以浏览器安装完全 ..
发布时间:2021-11-25 03:58:02 C#

将 Adob​​e 3D-pdf 转换为 WebGL?

有没有办法将 Adob​​e 3D-pdf 文件转换为 WebGL?我在网上搜索,但找不到方法.Adobe 3d pdf 文件的缺点是它们只能在 Internet Explorer 中直接在浏览器中查看(也许在 Safari 上 - 不知道),但是如果您使用 Firefox 或 Chrome,则需要下载文件并在杂技演员.此外,您需要激活它,有时需要调整安全设置……而 WebGL 可直接在现代浏览器 ..
发布时间:2021-11-25 03:56:50 C#

背面剔除的法线变换

从本课开始:WebGL 3D 透视图尝试实现背面剔除没有魔法. 我正在计算对象空间中的面部法线.之后,我在 m[2][3] 内设置 fudgeFactor 以获得透视除以 Z. 为了检查剪切矩阵是否有效,我直接使用从 WebGL 顶点着色器投影出来的顶点位置扩展了我的代码片段,并添加了“投影位置" 标志. 现在,我正在尝试使用变换法线内的 z 分量来隐藏 normal.z fud ..
发布时间:2021-11-25 03:46:27 C#

Three.js 中是否自动完成剪辑?

所以,我在这篇维基百科文章中阅读了有关剪辑的内容.它似乎对任何和所有游戏都非常重要,所以,我必须这样做,还是由 Three.js 甚至 WebGL 自动完成?谢谢! 解决方案 您可以将近和远裁剪平面的值传递给您的相机对象: var camera = new THREE.PerspectiveCamera( fov, aspect, near, far ); near 和 far 可以包 ..
发布时间:2021-11-25 03:43:48 C#

WebGL:如何使对象的一部分透明?

我在浏览器中有一个 3D 球,现在我想在它上面挖一个洞看看它的背面. 我怎样才能让它成为可能? 例如,我希望立方体的白色三角形部分可以是透明的(我的意思是我们可以看到立方体后面的背景). 我试图改变片段着色器中的 alpha(代码中的区域是正方形而不是三角形,没关系): 精密中等浮点数;不同的 vec4 vColor;统一浮动 uAlpha;无效主(无效){如果(gl_Frag ..
发布时间:2021-11-25 03:30:15 C#