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

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

  •  
  •   Alander · 63 天前 · 2192 次点击
    这是一个创建于 63 天前的主题,其中的信息可能已经有所发展或是发生改变。

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

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

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

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

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

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

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

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