小编kan*_*gax的帖子

我想编写一些扩展DOM节点的Javascript类(这样我就可以直接将我的类的实例插入到DOM中),但是我很难找到我应该继承的类/原型.

例如:

function myExtendedElement() {
       this.superclass = ClassA;
       this.superclass();
       delete this.superclass;
} 

但ClassA应该是什么？

在Fabric.js中,我们有Object修改过的事件,比如object:modified.我们是否有整个画布的类似事件.

实际上我正在尝试实现撤消和重做功能.我将画布保存为JSON,如果发生了某些事情并再次加载它以进行撤消功能.

我们是否在Fabric.js中为此功能提供了更好的解决方案？

我正在使用Fabric JS开发一个大型自定义应用程序,我已经做得很好.但我使用webfont的init加载文本对象有问题.

只要该字体在客户端的计算机上是本地的,我工作正常,因为未加载webfont并且画布上的文本对象以默认的sans-serif字体系列呈现.

简而言之,就是我所做的(在这个例子中,我使用"allstar"作为我的webfont):

CSS: 在fabric.js之前,css被加载到头部的fonts.css中

@font-face{
    font-family:'allstar';
    src:
        url('/path-to-fonts/all_star-webfont.eot');
    src:
        url('/path-to-fonts/all_star-webfont.eot?#iefix') format('embedded-opentype'),
        url('/path-to-fonts/all_star-webfont.woff') format('woff'),
        url('/path-to-fonts/all_star-webfont.ttf') format('truetype'),
        url('/path-to-fonts/all_star-webfont.svg#allstarregular') format('svg');
    font-weight:normal;
    font-style:normal
}

Javascript: 这是在$(document).ready(function(){})里面的页面底部加载的

var textSample = new fabric.Text(text, {
    fontFamily: "allstar",
});
canvas.add(textSample);
canvas.renderAll();

如果我在页面上的其他地方使用该字体(例如:在带有点和加载字体的透明span标签中),它可以正常工作.但我不认为这是一种正确的编码方式.

我使用fabric.js版本1.3.0

我有一个Fabric.js原型,人们可以将照片,文本和地图加载到画布中.当它们完成后,我希望它们能够将画布保存为图像.我尝试过使用这个标准:

canvasURL = canvas.toDataURL();
var image = new Image();
image.src = canvas.toDataURL("image/png");
$('#canvasContainer').replaceWith(image);

但是它说画布是tainted- 我认为是因为图像(上面的方法只是文字时才有效).错误是:

Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported. 

我可以使用Fabric的内置方法保存为SVG:

var canvasSVG = canvas.toSVG();
$('#canvasContainer').replaceWith(canvasSVG);

但我宁愿拥有PNG/JPG.有任何想法吗？

这是关于画布序列化的Fabric.js文档.

http://fabricjs.com/fabric-intro-part-3/#serialization

如何循环浏览Jekyll网站的帖子,但只对年份等于特定值的帖子采取行动？

{% for post in site.posts %}
  {% if post.date.year == 2012 %}
      <p>{{ post.date }}</p>
      <p>{{ post.title }}</p>
  {% endif %}
{% endfor %}

以上不起作用.这样做的正确方法是什么？

是否可以在Fabric.js中设置图像过滤器的动画？例如"像素化"过滤器.

我使用 fabric js 在 html5 中使用了画布。我想将轮廓应用于画布上的活动文本。我编写的以下代码工作正常，但问题是当我增加轮廓的厚度时，它会与文本重叠，这意味着文本颜色消失。

activeObject1.stroke = color;
activeObject1.strokeWidth = 5;

还有一件事通过应用这个我无法应用第二个大纲。我有一个例子，但它不适用于fabricjs。

http://jsfiddle.net/vNWn6/

我正在尝试加载一个有图像对象的json对象.图像对象具有基础64图像数据作为背景.但我无法提交loadFromJSON方法.

码:

var jsonDataSet = '{"objects":[{"type":"image","originX":"left","originY":"top","left":0,"top":0,"width":700,"height":600,"fill":"rgb(0,0,0)","overlayFill":null,"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":10,"scaleX":1,"scaleY":1,"angle":0,"flipX":false,"flipY":false,"opacity":1,"selectable":false,"hasControls":true,"hasBorders":true,"hasRotatingPoint":true,"transparentCorners":true,"perPixelTargetFind":false,"shadow":null,"visible":true,"clipTo":null,"src":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAn4AAAFPCAYAAADTHsP1AAAgAElEQ…Lv/vuU1wVsyvXK+Kks1f6gffSCThZ1km3u6NFklCnFes//AbZzi+iGF3/7AAAAAElFTkSuQmCC","filters":[]}],"background":""}';

canvas.loadFromJSON (jsonDataSet);

canvas.renderAll();

它显示错误为 "Error loading data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAn4AAAFPCAYAAADTHsP1AAAgAElEQ…Lv/vuU1wVsyvXK+Kks1f6gffSCThZ1km3u6NFklCnFes//AbZzi+iGF3/7AAAAAElFTkSuQmCC "

我需要扫描画布图像中的每个像素并做一些颜色等等.为了获得最佳性能,我应该一次性获取所有数据并通过阵列处理它吗？或者我应该在处理每个像素时调用它们.

基本上......

data = context.getImageData(x, y, height, width);

VS

data = context.getImageData(x, y, 1, 1); //in a loop height*width times.

当鼠标交互时,如何使OrbitControls的自动旋转停止,几秒钟之后它就像P3D一样启动.在这里用它们的徽标(http://p3d.in/)