FabricJS - 性能线程

-3

对不起，如果标题是误导性的，它是我可以想出的最接近的近似值，哈哈。FabricJS - 性能线程

好吧，所以我使用FabricJS作为面料打印客户端的概念验证，并且它们需要300PPI图像（即，巨大的怪异）。现在，如果你检查了我在下面弹出的JsFiddle，你会看到平铺是用一些似乎工作正常的while循环完成的，除了整个浏览器在加载时冻结的事实，这意味着我甚至不能粘装载机图标。

我做了一些可怕的错误，或者只是觉得它是如何工作的？只要我能够a）安装一个装载机，b）它不会，呃，“他已经死了，吉姆！”我的Chrome。如果有帮助，我会用base64获取图像。

大家欢呼！

编辑为背景，这里有从上传的文件创建模式的功能之一：

function renderMirror(){ 
showLoader(); 
var isFullRows = false; 
var rowIndex = 0; 
var totalHeight = 0; 

while(isFullRows == false){ 
    // let's start with filling up the row's columns. start the width at zero. 
    var totalWidth = 0; 
    var isFullCols = false; 
    var colIndex = 0; 

    if(rowIndex % 2){ 
     var isRowMirrored = false; 
    }else{ 
     var isRowMirrored = true; 
    } 

    while(isFullCols == false){ 
     colIndex++ 

     if(rowIndex == 1){ 
      console.log('row'); 
     } 

     if(totalWidth >= canvas.width){ 
      isFullCols = true; 
     } 

     if(colIndex % 2){ 
      var isColMirrored = false; 
     }else{ 
      var isColMirrored = true; 
     } 

     canvas.add(new fabric.Rect({ 
      left: totalWidth, 
      top: totalHeight, 
      fill: pattern, 
      flipX: isColMirrored, 
      flipY: isRowMirrored, 
      height: newImgHeight, 
      width: newImgWidth, 
      selectable: false 
     })); 

     totalWidth+= newImgWidth; 

     // safeguard 
     if(colIndex > 100){ 
      isFullCols = true; 
     } 
    } 

    // now instantiate the row. 
    rowIndex++; 
    if(totalHeight >= canvas.height){ 
     isFullRows = true; 
    } 

    totalHeight+= newImgHeight; 

    // safeguard 
    if(rowIndex > 100){ 
     isFullRows = true; 
    } 
} 
hideLoader(); 
}

整个事情是here，如果你想有一个适当的看一下吗？

来源

2016-08-22 MitchEff

我在这篇文章中做了一个失误？不太确定为什么这是downvoted。 – MitchEff

在链接中没有小提琴，请添加一些代码，不要强迫人们打开小提琴或将小提琴转换为片段。 – AndreaBogazzi

-2

我已经经历过类似的生成PDF的东西在300我尝试了两种不同的解决方案：

使用webWorkers这将做背景繁重的工作，并不会冻结浏览器，但是这种方法在我的用例中稍微慢了一点。
我把第二种方法是创建一个终点，我得到的只是基本的64图像，然后与图像的数据我生成使用imagemagick建立在300 DPI的PDF也创建一个虚拟画布用PDF JS从缩放画布生成图像的实际大小，以使其更快一点。

来源

2016-08-24 03:26:55

是的，我正在考虑与第二点类似的事情，基本上以300DPI上传图片，然后在引擎中使用较小的版本。哈哈，不知道为什么我们都陷入低调。我会标记这个答案。干杯! – MitchEff

FabricJS - 性能线程

回答

相关问题