LoS - 视野, 光照, 阴影 相关技术研究及分享

【本文参与征文活动】

About / 关于

一句话介绍一下这个项目,就是基于 cocos 引擎的 2d 光线追踪,视野范围计算,渲染相关的东西。

Resources / 资源

Repository / 仓库

SSRLoS-Cocos2dx v3.17

SSRLoS-CocosCreator_v1 v1.10

SSRLoS-CocosCreator_v2 v2.40

Online Demo / 在线演示

SSRLoS-Cocos2dx Demo

SSRLoS-CocosCreator_v1 Demo

SSRLoS-CocosCreator_v2 Demo

SSRLoS-Cocos2dx API Demo

codesandbox.io

基于 cocos2d-x 版本

SSRLoS-Cocos2dx-Visibility

SSRLoS-Cocos2dx-Shadow

SSRLoS-Cocos2dx-Modes

SSRLoS-Cocos2dx-Dirty-Detection

SSRLoS-Cocos2dx-Light

SSRLoS-Cocos2dx-Mask

SSRLoS-Cocos2dx-Multi-Lights

SSRLoS-Cocos2dx-Multi-Masks

SSRLoS-Cocos2dx-Output-Render

Native Demo / 原生演示

creator v2.4.0 纯 js 版本

v0.0.1_LoSCCC2_Web.apk

creator v1.10 纯 js 版本

v0.0.1_LoSCCC1_Web.apk

cocos2dx v3.17 jsbinding 版本

v0.0.1_LoSCC_Native.apk

cocos2dx v3.17 纯 js 实现版本,无 jsbinding 实现

v0.0.1_LoSCC_Web.apk

Doc / 文档

API / 文档

Wiki / 百科

Plan / 计划

后续的计划,同时包括了很多 2d 的光照,阴影相关的技术文章,有兴趣可以看下。

To Explore / 待探索

这里稍微贴一点:

Algorithm / 算法相关

Triangulation

Umbrella Development Log Beamcasting

Walls and Shadows in 2D

1

1

三角化算法的实现方式,当然这对于地图和障碍物可能会有一些特殊要求。但是换句话说,只要满足了条件,这样的算法的效率肯定是高于现在算法的,毕竟是 量身定做 的算法。

Bresenham

Raytracing on a grid

直线光栅化算法的实现方式。

Spatial Hashing / 空间散列

Radial Spatial Hashing for 2D Lighting

5

基于空间散列实现的光照系统,值得参考。

Better Collineation Culling / 优化共线剔除

. Culling 的处理中,过滤掉了可能出现的重复的端点,但是对于存在于同一射线上的端点,却是在后期生成射线的步骤中,才过滤掉。这期间经历了 生成辅助射线 的步骤。

考虑是否可以在 Culling 的阶段就过滤掉,如:

. 对需要保存的端点,计算斜率,象限
. 用 斜率_象限 的形式作为 key
. 判断待添加的端点,是否有已经存在的 斜率_象限
. 没有,则直接保存
. 有,则进一步计算距离平方,只保存一个距离光源更近的端点

目前暂时没有尝试,因为精度的问题,使用斜率作为 Key,很少的情况才会出现命中的情况,换句话说,这种机制可以剔除的共线情况会很少。

需要寻找更好的剔除共射线的方式是最好的。暂时没有尝试。

Better Sort / 优化排序

Better Hashcode / 优化哈希码

Quadtree / 四叉树

quadtree-js

4

Specific Obstacle Support / 特定障碍物对应

Bretter Intersection / 更好的相交算法

Separating Axis Theorem (SAT) Explanation

8

Process / 过程相关

Obstacle Merge / 障碍物合并

Connected Component Labeling

Clipper - an open source freeware library

Event System / 事件系统

生命周期回调

Render / 渲染

SDF Ray-Marching / 有向距离场 光线行进

2D global illumination - Shadertoy

lightsdf - Shadertoy

SDF arbitary 2D polygon - Shadertoy

sdf 2D lights and shadows - Shadertoy

2D sdf test - Shadertoy

2D Signed Distance Field Basics

2D光线追踪渲染 - sardinefish

Less Triangulate Render / 减少三角化渲染

Better Light Shader / 更好的光照

Better Blend Mode / 更好的混合模式

9

Shadow / 阴影

2D lights and shadows

Shadow Caster 2D

19

Difference Between Penumbra and Umbra

18

Normal Map

cocos2d-x dynamic light tutorial

Shadow Map

2D Pixel Perfect Shadows

Fast 2D shadows in Unity using 1D shadow mapping

Tutorial 16 : Shadow mapping

用于2D游戏光照的ShadowMap生成

25

Light

光照基础

Unity中实现2D光照系统

Glare Engine

Reflect / Refraction

miloyip / light2d

这些效果也可简单的在 cocos2dxcreator 中实现:

Voronoi diagrams / 维诺图

Fast Voronoi Diagrams and Distance Field Textures on the GPU With the Jump Flooding Algorithm

JumpFloodAlgorithm生成Voronoi和距离场贴图

Misc / 杂项

Better Creator / 更好的 Creator 支持

Better Camera / 更好的相机

Camera 摄像机

3D Support / 3D 支持

Byte56 GameDev - A light post

10

Voxel Cone Trace / 基于体素锥形光线追踪

关于VCT(voxel cone trace——基于体素的锥形光线追踪)Renderer的代码解读

Voxel Cone Tracing based Global Illumination

More Refactor / 重构

Gizmo Support / 编辑器可视化支持

TileMap Demo

在我看来,截至到现在,这个项目的 80% 精力都是放在了算法的优化在优化上,剩下的 20% 精力则是在渲染上。项目陆陆续续的已经做了很久,但是还有很多很多想做的。随便写几个:

  • 已有通用算法的优化
  • 定制型算法,针对一些特定使用场景的算法
  • GPU 算法,半 CPUGPU 算法
  • 算法已经做了很多,要的数据也到手了,那当然在渲染上要花大力气优化,做出酷炫的效果了
  • 更多的就写在文末的 后续计划 里了 …

项目是从 cocos2dx 开始的,目前几乎所有功能都已经移植了 Creator v1, v2 版本。而且所有版本都做了 Native Binding

但是因为精力有限,后面的新功能打算暂时只对应 cocos2dxcreator v2,当然 creator v3 出来的话也会考虑。暂时只对应 Web 版,当然原生也是可以直接用的,Native Binding 暂时不会去对应新功能。

最后打个广告,最近上架了一款关于 FBO 的插件扩展,后续也会用到 GPU 阴影算法的实现中,有兴趣的朋友也可以支持一下 [cc.RenderTexture cc.Camera FBO] 截图, 放大镜, Shader 伴侣


81赞

可以发到steam上估计会有人喜欢,也可以试试TapTap:+1:

肯定有兴趣啊

nb,想学习

棒棒的,期待

mark 666

mark!!!!!!!!

mark~!!!

MARK!

支持一下开源~不错的技术分享

支持大佬支持大佬支持大佬

牛逼…………

牛逼…………

卧槽,大佬诈尸了,记得很多年前就使用过大佬的开源代码。

卧槽牛逼。。。。。。。。。。。。。。。

卧槽, 大佬给跪了

大佬,厉害了

大佬,喝可乐

今天晚上花了点时间打了一下安卓的 apk 包,有兴趣的可以试试:
https://gitee.com/supersuraccoon/ssrlos-cocos2dx/attach_files

cocos2dx 提供了含绑定,非绑定两个版本,可以对比下性能差距是非常大的。

creator 本来也想一样发两个版本,结果才发现国庆写的绑定代码全部都没了:weary:
因为还没来得及传 git,然后对 creator 也不是很熟悉,所以手贱把 build 直接删了,忘记里面有 classes 文件夹了 :dizzy_face:

暂时不想再写一遍绑定代码了,准备最近花点时间整理下代码,先发 js 版本的了 …

顺便发一张这两天在学习的 sdf 的阴影效果:

牛逼…………