Мне нужно добавить данные в объект FabricJS и использовать их при экспорте холста - PullRequest
Новая
       6

Мне нужно добавить данные в объект FabricJS и использовать их при экспорте холста

0 голосов
/ 20 февраля 2019

Это функция, которую я использую для добавления объекта: 

function _addImageObject(imageURL) {
  fabric.util.loadImage(imageURL, function (imageLoaded) {

    var image = new fabric.Image(imageLoaded);

    image.set({
      borderColor: 'black',
      cornerColor: 'black',
      cornerStrokeColor: 'white',
      cornerSize: 11,
      transparentCorners: false,
    });

    canvas.add(image);
    canvas.centerObject(image);
    canvas.setActiveObject(image);
    canvas.renderAll();
  });
}

Функция, используемая для получения объектов: 

 function _canvasJSON() {
      try {
        let canvasCopy = _copyCanvas(canvas);

        let canvasJSON = {
          canvasImage: JSON.stringify(canvasCopy),
          svg: canvas.toSVG()
        };
        return canvasJSON;
      } catch (e) {
        canvas.renderAll();
      }
    }

function _copyCanvas() {
     let canvasString = JSON.stringify(canvas);
     return JSON.parse(canvasString);
}

Я хотел бы добавить объект в это изображение, например, так: 

image.set('key', { values: 123});

И иметь возможность получить его после возврата _canvasJSON().

1 Ответ

0 голосов
/ 22 февраля 2019

Если вам нужно добавить / получить произвольную пару ключ / значение к любому объекту fabricJS, вы можете сделать это так же, как и с любой другой парой ключ / значение: 

image.set('width', 100);
image.get('width');

image.set('customKey', 'Custom value added here');
image.get('customKey');

image.set({
  borderColor: 'black',
  values: 123
  transparentCorners: false,
});
image.get('values');

Если вам нужно экспортировать холст fabricJS,используйте это: 

const customKeys = ['customKey', 'values'];
canvas.toJSON(customKeys);

toJSON() принимает массив в качестве параметра.Этот массив ДОЛЖЕН включать любой пользовательский ключ, который вы прикрепили к любому объекту.Он также нуждается в любом ключе, который не является частью ключей по умолчанию от объекта (например: 'evented', hoverCursor ',' scaleX 'и т. Д.)

использование canvas.loadFromJSON(json) для загрузки экспортированного json.

Подробнее о toJSON в документации .

...