【问题标题】:Applying WebGL filter on HD Images cuts the image (fabric V2-beta-6)在高清图像上应用 WebGL 过滤器会剪切图像(织物 V2-beta-6)
【发布时间】:2019-07-14 07:29:29
【问题描述】:

目前正在使用 fabric 2.0.6 对高清图像应用过滤器。我需要在最短的时间内应用过滤器。为此,我使用 webGL 方法应用过滤器,如 here (fabric.js demo) 所述。如果您将它应用于大小

原始图像(大小 1.90 MB)

应用过滤器之前的显示方式

应用灰度滤镜后的效果

【问题讨论】:

    标签: image fabricjs


    【解决方案1】:

    如果您参考变更日志和解释,请:

    http://fabricjs.com/fabric-filters

    您会注意到文档谈论的是fabric.textureSize 属性,而不是查看演示应用程序。

    限制与兆字节大小无关,但与像素大小有关。

    它设置为 2048,大小为基本设置,以适应大多数旧硬件并为您提供最大 2048x2048 的过滤器大小。

    在启动您的应用之前将此值提高到您认为要支持的最大大小。例如 4096。

    如果超过 5000,您可能会失去对 ie11 的支持。

    您必须注意两个限制: 浏览器中的最大画布尺寸和用户正在使用的笔记本电脑硬件中的最大纹理尺寸。

    【讨论】:

    • 感谢您的帮助。如果我可能会问,我如何计算适合 2800 x 1800 尺寸图像的过滤器尺寸?是否有公式可以预测图像的合适滤镜尺寸?
    • 你必须拿起 2800。纹理被创建为与图像一样大,而放置它的画布是创建正方形。可能是因为我不想插入2个参数,背后真的没有具体原因。所以你的 webgl 画布将是 2800x2800
    • 我按照您的指示将 fabric.textureSize 增加到 4096,但图像仍然被切掉
    猜你喜欢
    • 2018-02-14
    • 2015-07-07
    • 2014-12-20
    • 2012-10-13
    • 2018-06-20
    • 2015-06-17
    • 1970-01-01
    • 1970-01-01
    • 2014-08-21
    相关资源
    最近更新 更多