首页   注册   登录
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
Coding
V2EX  ›  程序员

发现个酷炫的动效用 webgl 写的,想知道这个雾化的轨迹计算是啥?

  •  
  •   Alander · 19 天前 · 2048 次点击

    今天发现个网站: https://www.coloros.com/topic/coloros7.html

    这个网站的“专属艺术名片”页面,随着鼠标移动有雾化的彩色跟随

    想知道这个是如何计算轨迹的?

    有人能给出个大致方向吗?

    28 回复  |  直到 2019-11-23 03:43:42 +08:00
        1
    meteor957   19 天前
    这动画确实挺秀
        2
    Rhonin   19 天前
    这就是个 canvas 吧,mousemove 事件?
        3
    mengkun   19 天前   ♥ 5
    用的是这个开源组件: https://github.com/PavelDoGreat/WebGL-Fluid-Simulation

    ----------
    题外话,coloros 这个页面感觉是实习生写的。这一连串的函数……无力吐槽
    https://i.loli.net/2019/11/22/Ia41eto5GnZFJCh.png
        4
    Alander   19 天前
    @mengkun 哈哈哈哈哈,十分感谢帮我找到这个组件,可是你是如何找到这个组件的呢?
        5
    Alander   19 天前
    @Rhonin 是的,确实是监听 mousemove 事件,只是好奇这个雾化的怎么做的
        6
    JerryCha   19 天前
    @mengkun j...jQuery ?????
    我还以为国内早就已经全面 ARV 化了。
        7
    Alander   19 天前
    @JerryCha 哈哈哈哈哈,在做这种小应用的时候,原生 + JQuery 可能更加快速能够出页面
        8
    mengkun   19 天前
    @Alander 因为昨天晚上我也在思考和你这同样的问题……然后就研究了一下这个页面的源代码,然后就在 Github 上给找到了……
        9
    meteor957   19 天前
    @mengkun 请问老哥 截图中看代码用的啥插件啊,可以格式化混淆后的 js 吗
        10
    Alander   19 天前
    @mengkun 哈哈哈哈哈哈,看来大家都比较好奇呀
        11
    Alander   19 天前
    @meteor957 格式化的话本身 chrome 的 devtools 就可以啊
        12
    mengkun   19 天前
    @meteor957 插件是 iFormatTool,作者 @MaiCong
    格式化功能只能简单的排下版
        13
    lvA   19 天前
    是我机子垃圾吗有点卡啊
        14
    coloz   19 天前
    @lvA 1050ti 的笔记本表示,加载的时候卡
        15
    Alander   19 天前
    @coloz
    @lvA
    我公司辣鸡台式机感觉都很流畅啊,不知道啥情况
        16
    yejinmo   19 天前
    有没有有闲心的大佬提取下这个效果做 Wallpaper Engine 的壁纸啊。。
        17
    Atukey   19 天前
    @yejinmo 好主意~
        18
    yejinmo   19 天前
    @Atukey #17

    js 被压缩混淆了。。看的头疼
        19
    Jiajin   19 天前
    这动画效果是挺帅的
        20
    yangheng4922   19 天前
    @yejinmo 已经有了 网页的 我之前用过
        21
    wednesdayco   19 天前
    我记得是 nvdia 出的源码
        22
    yangheng4922   19 天前   ♥ 1
        23
    hyy1995   19 天前
    挺酷
        24
    secondwtq   19 天前
    推荐 https://www.shadertoy.com/
    显卡不好慎开
        25
    realpg   19 天前
    以前还没有前端这个词的时候
    搞博客就喜欢搞这些没用的跟随鼠标特效

    现在这只是浏览器 API 多了 更酷炫一点
        26
    Les1ie   19 天前
    @yangheng4922 #22 少侠好功夫
        27
    secondwtq   19 天前
    @realpg 博客上面搞确实没用 ...
    这个用来宣传产品比放博客上稍微强那么一点点吧
    关于   ·   FAQ   ·   API   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   4319 人在线   最高记录 5043   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.3 · 31ms · UTC 01:58 · PVG 09:58 · LAX 17:58 · JFK 20:58
    ♥ Do have faith in what you're doing.