微笑面对bug-CSDN博客

原创 Cesium逼真水面，动态水波，倒影

倒影的原理：计算相机到水平面视点的入射光线的反射光线，用反射光线方向向量在一个天空盒上采样。在上一篇的基础上，增加水面的倒影。

2023-06-21 15:56:17 2660 6

原创 Cesium实现一材质多贴图，一个模型多张贴图，自定义attribute

Material.fabric.uniforms添加自定义的两张贴图image_0，image_1。Geometry.attributes添加imgIdx自定义属性，用于标识该顶点使用哪张贴图。顶点着色器把imgIdx传入片元着色器。片元着色器把imgIdx传入source（插值后的结果会有误差，所以用差的绝对值小于0.1来判断标识的值），source中根据imgIdx的值选取采样器（贴图）。

2022-08-25 10:24:44 2316

原创 Cesium使用DEM地形数据(.tif)创建自定义Primitive

第一步：用python把tif文件解析成高程数据，第二步：把地形数据分成小块创建geomotry.贴图使用mapbox的web墨卡托影像图，uv计算涉及到web墨卡托与经纬度的相互转换

2022-08-24 18:04:36 1683

原创 Cesium自定义shader材质实现逼真水面，支持uniforms属性实时修改

水的shader代码参考的是Shader - Shadertoy BETA本文主要解决在cesium的shader中如何实时修改时间变量iTime,从而实现材质的动态变化。MaterialAppearance.fragmentShaderSource与vertexShaderSource可以自定义shader材质，但是不支持uniforms传参，于是加入fabric，在fabric.source中可以获取uniforms中的属性，然后我直接在fabric中处理片元的着色，而fragmentShaderSou

2022-07-08 17:49:37 7136 28

原创【斗地主 javascript js 斗地主 AI 人机网页在线】基于专家系统的斗地主AI算法

在线试玩：http://changjiuxiong.gitee.io/ddz/源码地址：https://gitee.com/changjiuxiong/ddz效果图：AI 草稿思路：

2020-09-26 18:02:55 1756

原创【WebGL实战】threejs开发3D游戏英雄联盟LOL

demo地址：http://bald_club.gitee.io/lol-web/源码地址：https://gitee.com/bald_club/LOL-Web效果截图操作说明：鼠标右键点击地面：走路空格键：视角锁定英雄身上备注：寻路算法：我之前写的AStar.js，详情见https://blog.csdn.net/qq_25169689/article/details/107721543模型来源：网络仅供学习。...

2020-08-26 22:51:42 1471

原创【WebGL实战】threejs开发二维地图

demo地址：http://changjiuxiong.gitee.io/map2d/源码地址：https://gitee.com/changjiuxiong/map2D效果截图使用谷歌影像。下一步准备做三维地球。

2020-08-24 20:07:03 2061

原创【A*算法实现 javascript版】A星算法javascript库，5行代码计算最短路径

演示地址：http://changjiuxiong.gitee.io/a_star/源码地址：https://gitee.com/changjiuxiong/A_Star运行截图：不讲原理，A*算法已被讲烂。我将A*算法封装成一个JS库，名为AStar。要计算一条路径，只需几行代码！let task = new AStar.Task(); //新建寻路任务task.setStart(40,0); //设置起点task.setEnd(40,80); //设置终点//设置障碍/

2020-07-31 21:28:18 1366

原创【造轮子光栅化渲染器】如何只用一个画点的函数画出3D图像——javascript光栅化渲染器的实现

如果我们只有一个画像素点的接口canvas.fillRect(x,y,1,1) //在屏幕的(x,y)处填充一个像素我们能画出些什么？演示地址：http://changjiuxiong.gitee.io/canvas3drenderer-nowebgl/demo/index.html#demo_gltf源码地址：https://gitee.com/changjiuxiong/Canvas3DRenderer-noWebGL成果图：答案是：任何东西。（如果你有模型文件或者

2020-06-03 13:49:45 261

原创【WebGL实战】threejs开发在线魔方程序，手动、自动还原魔方

demo地址：在线魔方码云地址：magicCube效果截图暂时只实现了全部标准操作、打乱。后续更新自动还原功能，敬请关注。附上公式标识符图文介绍（RUF LDB ruf ldb MES xyz）...

2020-03-27 11:15:44 969

原创 WebGL绘制3D文字（非中文）

本教程是我在贴吧为吧友写的，搬到博客以备份。demo地址：cool.js——3D文字源码地址：cool.js此教程介绍一种简单粗暴的绘制3D文字的方案。本教程以数字为例。核心思想：制作或下载阿拉伯数字的二维几何面(Geometry)数据在程序中将二维面“拔”成三维（难点）渲染第一步。我自己制作数字的geometry。以数字2为例：先构建一个二维面。...

2019-05-10 09:19:15 1079

原创 drawElements只渲染出模型的一部分，顶点数量太多——WebGL开发中的问题记录（2）

此系列文章用于记录我使用WebGL开发3D引擎时遇到的问题和解决方案（也可能暂未解决）。项目demo地址：cool.js项目源码地址：cool.js——码云----------------------正文分割线---------------------------------开始做渲染GLTF模型时，出现只能渲染出一部分的问题。经查，是由于我创建index数据时用的Uint8Arr...

2019-04-22 21:24:19 1161 1

原创多个纹理时activeTexture与bindTexture的顺序问题——WebGL开发中的问题记录（1）

此系列文章用于记录我使用WebGL开发3D引擎时遇到的问题和解决方案（也可能暂未解决）。项目demo地址：cool.js项目源码地址：cool.js——码云----------------------正文分割线---------------------------------为第一次写博客干杯庆祝！要在一个着色器程序(shader program)中使用2个纹理(texture...

2019-04-21 13:32:44 2521

微笑君的博客