V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
tanranran
V2EX  ›  问与答

html5 处理图片问题,如何 [扭曲] 一个图片?

  •  
  •   tanranran · 2017-12-28 23:42:01 +08:00 · 2218 次点击
    这是一个创建于 2513 天前的主题,其中的信息可能已经有所发展或是发生改变。
    求助大佬,要实现一个产品展示的功能,假如原始图片如图所示:

    现在给一张图片过来,怎么把图片做成包围杯子的效果?如图所示
    9 条回复    2017-12-29 22:49:21 +08:00
    Aoang
        1
    Aoang  
       2017-12-29 00:01:17 +08:00 via Android   ❤️ 1
    …这是扭曲?………

    css 图层叠加应该可以做到。
    js 也行。
    html 做不到,起码 html5 不行。甚至,html10 也不行…
    tanranran
        2
    tanranran  
    OP
       2017-12-29 00:05:30 +08:00
    @Aoang 谢谢大佬回复,css 图层叠加可以做到,但是杯子的边缘不好处理啊,目前想到的解决方案是 three.js,但是学习成本太高...所以,想到 V2 咨询下大佬们的意见.
    dixeran
        3
    dixeran  
       2017-12-29 00:14:01 +08:00 via Android
    webgl 这个方向吧,css 能扭曲的样式不多
    WildCat
        4
    WildCat  
       2017-12-29 00:18:32 +08:00 via iPhone   ❤️ 1
    实在不行 web assembly 😅
    tanranran
        5
    tanranran  
    OP
       2017-12-29 00:34:13 +08:00
    @WildCat web assembly,太高端了,感觉最靠谱的还是 three.js
    tanranran
        6
    tanranran  
    OP
       2017-12-29 00:34:37 +08:00
    @dixeran 是的,目前来看 webgl 感觉最合适了.three.js
    MinonHeart
        7
    MinonHeart  
       2017-12-29 12:05:45 +08:00
    这个还是 PS 生成两个图层实在
    MinonHeart
        8
    MinonHeart  
       2017-12-29 12:07:07 +08:00
    用 webgl 底图要是渲染出来的模型可以,一张图的话估计不行
    tanranran
        9
    tanranran  
    OP
       2017-12-29 22:49:21 +08:00
    @MinonHeart 两个图层是一定的
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1105 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 22:46 · PVG 06:46 · LAX 14:46 · JFK 17:46
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.