草庐IT

javascript - 如何在 WebGL 中使用多个纹理?

我想在一个立方体上使用6种不同的纹理,每边一个,但找不到错误。这是我当前的代码:vartexturen=newArray();functioninitTexture(sFilename,texturen){varanz=texturen.length;texturen[anz]=gl.createTexture();texturen[anz].image=newImage();texturen[anz].image.onload=function(){gl.bindTexture(gl.TEXTURE_2D,texturen[anz]);gl.pixelStorei(gl.UNPACK

javascript - WebGL:尽管使用相同的代码,但一切都很模糊

刚开始使用WebGL,尝试绘制一些基本线条,甚至不是多边形。我找到了几个示例,将它们复制粘贴到本地并从Firefox中运行它们,它们看起来不错:锐利、清晰的边缘。然后,我创建了自己的项目,重构了(糟糕的!)samle代码,使用RequireJS加载等,示例仍然有效,但现在我的边/点/线都是模糊的。就像一些糟糕的抗锯齿设置把一切都搞砸了。我尝试了所有方法,起初我的代码看起来有些不同(尽管功能相同,恕我直言),然后我进行了更多重构以使其看起来与示例几乎相同,但我仍然看到模糊的线条。我做错了什么?示例代码:http://jsfiddle.net/6QCNR/示例代码的实时工作版本:http:

javascript - WebGL:将 spritebatch 渲染到渲染纹理时的奇怪行为

技术:WebGL/GL当我立即将10kSprite(使用spritebatch)渲染到后台缓冲区时,一切正常。10k当我将它渲染到渲染纹理中时,我遇到了一些关于alpha混合的奇怪问题(我猜……)。在纹理具有透明像素的地方,alpha计算错误(IMO它应该是累积的)。10k1k200黑色背景混合配置:gl.enable(gl.BLEND);gl.blendEquation(gl.FUNC_ADD);gl.blendFunc(gl.SRC_ALPHA,gl.ONE_MINUS_SRC_ALPHA);这就是我创建渲染缓冲区的方式:this._texture=this.gl.createTe

javascript - 在 Mapbox GL JS 中显示和隐藏图层的功能

我发现以下代码可以在MapboxGL中显示和隐藏图层:https://www.mapbox.com/mapbox-gl-js/example/toggle-layers/这很有用,但是,我只有一个包含所有必要数据的.geojson层(折线),不需要创建单独的层。我想实现完全相同的功能,能够在map菜单中显示和隐藏一层的功能。共有12种不同的特征类型,包含在名为“类型”的列中。我想打开和关闭类型,就像在示例中一样。有没有一种简单的方法可以在JS中使用set.Filter来做到这一点?https://github.com/mapbox/mapbox-gl-js/blob/e9386d288

javascript - 如何在 mapbox gl 中以编程方式关闭所有弹出窗口?

所以,我知道我们在MapboxGLAPI中有Marker.togglePopup()。但是我们可以通过编程方式关闭所有弹出窗口吗? 最佳答案 这是一个例子:https://jsfiddle.net/kmandov/eozdazdr/单击右上角的按钮打开/关闭弹出窗口。假设您有一个弹出窗口和一个标记:varpopup=newmapboxgl.Popup({offset:[0,-30]}).setText('ConstructionontheWashingtonMonumentbeganin1848.');newmapboxgl.Mar

javascript - 如何为 MapBox GL JS 使用 OpenMapTiles 服务器?

在OpenMapTiles的docs中据说,它可以为MapBoxGLJS提供矢量图block。但是为这两个项目挖掘文档我没有找到一个选项:如何配置自托管的MapBoxGLJS库以使用来self的自托管OpenMapTiles服务器的图block? 最佳答案 我还成功使用了Klokantech的tileserver-gl但是,我真的想要比这更简约的东西。更小更适合我的低智商。碰巧npm中有一个MBTiles模块。这使得设置节点tileserver变得非常容易。我在博客中解释here和here.它们都是同一个博客。这是服务器的js代码(

javascript - WebGL 使用 gl-matrix 库 mat4.translate 未运行

我有这段代码:functionsetupWebGL(){gl.clearColor(0.1,0.5,0.1,1.0);gl.clear(gl.COLOR_BUFFER_BIT);gl.viewport(0,0,400,300);mat4.perspective(45,400/300,0.1,100.0,pMatrix);mat4.identity(mvMatrix);mat4.translate(mvMatrix,[0,0,-2.0]);}除了最后一行,代码中的所有内容都运行mat4.translate(mvMatrix,[0,0,-2.0]);我知道这一点是因为我在每一行之后都放置了

javascript - 如果不使用像 three.js 这样的库,我将如何在 webgl 中进行环境反射?

我正在尝试弄清楚如何将环境映射到对象上。这是设置:如何让茶壶的表面反射(reflect)周围环境?所以我的意思是,茶壶不应是那种灰色阴影,它的表面应该反射(reflect)它的环境,所以它应该将棋盘映射到它的表面上。这是我试图完成的示例,但它使用了Three.js我想自己做(这是为了上课)。http://aerotwist.com/tutorials/create-your-own-environment-maps/demo/这有意义吗?我将如何开始?跟进我在完成家庭作业后回答了这个问题:https://stackoverflow.com/a/10093646/196921.请参阅链接

javascript - Mapbox GL js 可用图标

我正在将一个Web应用程序从Mapbox.js重写为MapboxGLjs。使用标准的“mapbox://styles/mapbox/streets-v8”样式,我在哪里可以找到所有工作标记图标的列表?这是我的代码:m.map.addSource("markers",{"type":"geojson","data":{"type":"FeatureCollection","features":{"type":"Feature","geometry":{"type":"Point","coordinates":["-75.532965","35.248018"]},"properties"

javascript - WebGL - 无效操作 useProgram

我正在学习WebGL并在this上与照明有关的教程。我是JavaScript的新手,所以我还不太擅长调试它。我不断收到这些错误,有人知道我为什么会收到这些错误以及如何解决吗?WebGL:INVALID_OPERATION:useProgram:programnotvalidhttp://insanergamer.zxq.net/:1WebGL:INVALID_OPERATION:getAttribLocation:programnotlinkedhttp://insanergamer.zxq.net/:1WebGL:INVALID_OPERATION:getUniformLocatio