小编kan*_*gax的帖子

当我使用Fabric.js生成画布时,在iPad(迷你)和iPhone(4)中用手指敲击时会出现恼人的闪烁.闪烁就像帆布快速变黑而再变白.

重现步骤:

1. 用iPad或iPhone浏览例如.此线条绘制实用程序:http: //jsfiddle.net/fabricjs/URWru/ (function dummy{})

2. 将手指放在画布上然后将其抬起.这样做很快,就像用鼠标点击一样.手指向上时会发生闪烁.如果您将手指放在画布上一秒钟或更长时间然后向后抬起,则不会发生闪烁.

为什么闪烁发生以及可以采取哪些措施来防止它？

我正在尝试使用Fabric.js进行交互式绘图.现在我可以使用鼠标绘制一个矩形.但是在我完成绘制矩形后,我无法选择它,除非我在绘制后使用左上角控制器调整一次.我想知道什么打破了事件系统.

这是我的代码:http://jsfiddle.net/rmFgX/1/

var canvas = new fabric.Canvas('canvas');

    var rect = new fabric.Rect({
        top : 100,
        left : 100,
        width : 60,
        height : 70,
        fill : 'red'
    });

    canvas.add(rect);

    canvas.on('mouse:down', function (option) {
        console.log(option);
        if (typeof option.target != "undefined") {
            return;
        } else {
            var startY = option.e.offsetY,
                startX = option.e.offsetX;

            console.log(startX, startY);

            var rect2 = new fabric.Rect({
                top : startY,
                left : startX,
                width : 0,
                height : 0,
                fill : 'transparent',
                stroke: 'red',
                strokewidth: 4 …

我正在使用PhantomJS版本1.9.8,并且在使用生成器的文件上得到错误"SyntaxError:Parse error"(由javascript 1.7支持).

我找不到任何关于PhantomJS做什么和不支持的文档,有没有人知道这样的文档？或者知道让PhantomJS解析函数*和for..of语句的变通方法？

我打算使用Frabic.js来构建房间布局.它基于网格布局(网格大小:25),对象捕捉到位.

我试图覆盖调整大小事件,使宽度成为网格大小的倍数(25).然而,它似乎随机调整元素大小.

码

   var canvas = new fabric.Canvas('section', { selection: true }); fabric.Object.prototype.transparentCorners = false;
   var canvasWidth = 600;
   var canvasGrid = 25;

   canvas.on('object:modified', function(options) {
        options.target.set({opacity: 1}); // Return the opacity back to 1 after moving

        var newWidth = (Math.round(options.target.getWidth() / canvasGrid)) * canvasGrid;
        console.log("Width:" + options.target.getWidth());
        console.log("Desired width: " + newWidth);

        if(options.target.getWidth() !== newWidth) {
            console.log("alter the width");
            options.target.set({ width: newWidth });
            console.log("Width changed to: " + options.target.getWidth());
        }

        console.log("Final width: " + options.target.getWidth());
    });

最终用户即时添加对象,其代码如下.

    $("#addBlock").click(function(e){
        e.preventDefault(); …

HTML5画布为使用 javascript 绘制图像提供了很大的灵活性。我们需要根据用户的输入生成 javascript 代码（比如 10 个蓝色球、5 个绿色方块和特定大小......）。是否有提供适当的 Javascript API 的库，以便更轻松地生成画布以及满足上面列出的要求的 javascript 代码？

是否可以将Fabric.js与Web字体一起使用,而无需附加Cufon库及其字体？我可以使用标准的画布功能轻松完成它,所以我想知道它是否可以在Fabric中使用.

我刚读完一篇关于ECMAScript 5严格模式的文章.

它说ECMAScript 5添加了.bind().

var obj = {
  method: function(name){
    this.name = name;
  }
};

obj.method.bind(obj,"hello");

是不是与obj.method.call(obj,"你好")相同？

如何在Fabric.js元素的上下文中应用"沿Arc Path的HTML5 Canvas文本"？

http://www.html5canvastutorials.com/labs/html5-canvas-text-along-arc-path/ 使用上面的链接我们可以显示弯曲文本,我怎样才能在fabric.js中实现这一点？

JS小提琴:: http://jsfiddle.net/E5vnU/

      function drawTextAlongArc(context, str, centerX, centerY, radius, angle) {
    var len = str.length, s;
    context.save();
    context.translate(centerX, centerY);
    context.rotate(-1 * angle / 2);
    context.rotate(-1 * (angle / len) / 2);
    for(var n = 0; n < len; n++) {
      context.rotate(angle / len);
      context.save();
      context.translate(0, -1 * radius);
      s = str[n];
      context.fillText(s, 0, 0);
      context.restore();
    }
    context.restore();
  }
  var canvas = document.getElementById('myCanvas'), 
    context = canvas.getContext('2d'),
    centerX = canvas.width / 2,
    centerY = canvas.height - 30,
    angle …

我有画布,其中包含对象centeredRotation:true和其他对象selectable:false 当我将此画布转换为JSON并重新加载它.对象具有默认属性.即没有居中的旋转和物体是可选择的.我可以知道为什么会这样吗？显然,像centralRotation,selectable这样的属性不包含在JSON中.

{ "类型": "矩形", "originX": "左", "originY": "顶", "左":92, "顶部":53, "宽度":150, "高度":150,"填写 ":" #778899" , "中风":空, "strokeWidth":1, "strokeDashArray":空, "strokeLineCap": "对接", "strokeLineJoin": "人字", "strokeMiterLimit":10",将scaleX ":1," 的scaleY ":1," 角度 ":0",flipX ":假" flipY ":假," 不透明性 ":0.4," 影子 ":空," 可见 ":真" clipTo":空 "的backgroundColor": "", "RX":0, "RY":0, "×":0, "Y":0}], "背景": ""}

如何在加载对象时设置这些？

我们正在使用fabric.js java脚本框架,因为它有很好的api用于画布绘制.但我们需要使用这个框架支持富文本编辑功能,例如,如果我有一个文本框我想在文本框中键入,并希望进行文本部分编辑,如更改其颜色字体等,并将其保存在画布上.

我有一个选择是首先创建一个普通文本框,在其中进行部分编辑,生成的html我必须通过填充文本等将其转换为画布文本.

对此最好的方法是什么？