如何在fabric.Image()中添加自定义内容 [英] How to add custom content in fabric.Image()

问题描述

我正在尝试使用以下建议的方式将画布存储在服务器中:

I am trying to use the following suggested way to store canvas in the server:

Fabric.js-如何保存具有自定义属性的服务器上的画布

但就我而言，我是从类似

But in my case, I am loading an image from a url like:

fabric.Image.fromURL(url, function(image) {
   image.alt = product.skuId;
   image.productClass = product.productClass;
   canvas.add(image);
 }, {
   crossOrigin: "Annoymous"
});

但是，当我尝试将其存储在db中时，不会存储较新的属性.

But when I try to store the same in the db the newer attributes are not stored.

有没有一种方法可以在数据库中存储自定义属性(甚至是"alt")?

Is there a way to store custom attribute (or even "alt") in the DB?

用我尝试过的方法创建了一个小提琴: https://jsfiddle.net/anjhawar/dpyb7cf7/

Created a fiddle with what I tried: https://jsfiddle.net/anjhawar/dpyb7cf7/

按保存时，画布将转储到本地存储中，但是按照示例，当我们检查对象"数组时，没有得到自定义属性，即"id"和"alt".

When we press save the canvas is dumped in the local storage, but when we check the "objects" array we do not get the custom attributes i.e. "id" and "alt", as per the example.

我想念什么吗?

推荐答案

这里是存储自定义属性(id)的解决方案.

Here my solution to store custom attribute (id).

fabric.Image.fromURL(link, function(img) {
    img.set({
        id : 'image_'+index,
        width : canvas.width / 2,
        height : canvas.height / 2
    });
    canvas.add(img).renderAll().setActiveObject(img);
});

为了快速查看，这是一个工作代码: http://jsfiddle.net/mullainathan/dpyb7cf7/1

For quick review here is a working code : http://jsfiddle.net/mullainathan/dpyb7cf7/1

这篇关于如何在fabric.Image()中添加自定义内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！