V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
bojue
V2EX  ›  分享创造

终于有时间优化 canvas 画笔的锯齿问题

  •  1
     
  •   bojue ·
    bojue · 2020-03-28 18:33:00 +08:00 · 2722 次点击
    这是一个创建于 1484 天前的主题,其中的信息可能已经有所发展或是发生改变。

    canvas 开发画笔是一个简单的功能,但是如果直接使用 moveTo()方法创建直线的方式,创建的直线锯齿严重,影响体验。

    今天使用二次贝塞尔曲线方案处理锯齿,效果比较满意。在线预览

    预览

    Github 仓库https://bojue.github.io/Sketchpad/

    5 条回复    2020-03-30 10:19:03 +08:00
    bojue
        1
    bojue  
    OP
       2020-03-28 20:04:08 +08:00
    github 仓库地址: https://github.com/bojue/Sketchpad
    yafoo
        2
    yafoo  
       2020-03-28 21:08:19 +08:00 via Android
    不支持手机啊,体验不了
    bojue
        3
    bojue  
    OP
       2020-03-28 21:21:36 +08:00 via iPhone
    @yafoo 这个是 pc 端的,不是移动端画图工具,不好意思
    jorneyr
        4
    jorneyr  
       2020-03-30 10:14:23 +08:00
    快速画效果可以,速度慢的话就有明显的锯齿
    bojue
        5
    bojue  
    OP
       2020-03-30 10:19:03 +08:00
    @jorneyr 这个问题我居然没考虑到,只顾着处理之前遇到的快速绘制锯齿问题,很好的 case 我抽时间处理一下,谢谢建议
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   2535 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 15:47 · PVG 23:47 · LAX 08:47 · JFK 11:47
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.