How to use the fabric.fabric.util function in fabric

To help you get started, we’ve selected a few fabric examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github FelixHenninger / lab.js / packages / builder / src / components / ComponentOptions / components / Content / Canvas / components / fabric / index.js View on Github external
fabric.Image.fromObject = function(_object, callback) {
  var object = fabric.util.object.clone(_object)
  fabric.util.loadImage(object.src, function(img, error) {
    // Substitute empty image in case of error
    const image = new fabric.Image(
      error ? new Image() : img,
      object
    )
    image.crossOrigin = "anonymous"

    // Pretend that we were successful in any case
    callback(image)
  })
}
github FelixHenninger / lab.js / packages / builder / src / components / ComponentOptions / components / Content / Canvas / components / fabric / index.js View on Github external
// Substitute empty image in case of error
    const image = new fabric.Image(
      error ? new Image() : img,
      object
    )
    image.crossOrigin = "anonymous"

    // Pretend that we were successful in any case
    callback(image)
  })
}

// Add AOI object type ---------------------------------------------------------

// (apparently fabric requires camelcased constructors)
fabric.Aoi = fabric.util.createClass(fabric.Rect, {
  type: 'aoi',
  label: '',
  initialize: function(options={}) {
    options.fill = 'rgba(0, 0, 0, 0.2)'
    this.callSuper('initialize', options)
  },
})

fabric.Aoi.fromObject = function(object, callback, forceAsync) {
  return fabric.Object._fromObject('Aoi', object, callback, forceAsync);
}

// Canvas component ------------------------------------------------------------

const handlePadding = 6
github FelixHenninger / lab.js / packages / builder / src / components / ComponentOptions / components / Content / Canvas / components / fabric / index.js View on Github external
fabric.Image.fromObject = function(_object, callback) {
  var object = fabric.util.object.clone(_object)
  fabric.util.loadImage(object.src, function(img, error) {
    // Substitute empty image in case of error
    const image = new fabric.Image(
      error ? new Image() : img,
      object
    )
    image.crossOrigin = "anonymous"

    // Pretend that we were successful in any case
    callback(image)
  })
}
github bfortuner / labelml / src / components / Editor.vue View on Github external
toObject: function() {
        return fabric.util.object.extend(
          this.callSuper('toObject'), {
            label: this.get('label'),
            score: this.get('score')
        });
    },
github go-gitea / gitea / build / generate-images.js View on Github external
const canvas = new fabric.Canvas();
  canvas.setDimensions({width: size, height: size});
  const ctx = canvas.getContext('2d');
  ctx.scale(options.width ? (size / options.width) : 1, options.height ? (size / options.height) : 1);

  if (bg) {
    canvas.add(new fabric.Rect({
      left: 0,
      top: 0,
      height: size * (1 / (size / options.height)),
      width: size * (1 / (size / options.width)),
      fill: 'white',
    }));
  }

  canvas.add(fabric.util.groupSVGElements(objects, options));
  canvas.renderAll();

  let png = Buffer.from([]);
  for await (const chunk of canvas.createPNGStream()) {
    png = Buffer.concat([png, chunk]);
  }

  png = await imageminZopfli({more: true})(png);
  await writeFile(outputFile, png);
}
github nhn / tui.image-editor / src / js / component / text.js View on Github external
this._textarea = textarea;

        this._listeners = snippet.extend(this._listeners, {
            input: this._onInput.bind(this),
            keydown: this._onKeyDown.bind(this),
            blur: this._onBlur.bind(this),
            scroll: this._onScroll.bind(this)
        });

        if (browser.msie && browser.version === 9) {
            fabric.util.addListener(textarea, 'keydown', this._listeners.keydown);
        } else {
            fabric.util.addListener(textarea, 'input', this._listeners.input);
        }
        fabric.util.addListener(textarea, 'blur', this._listeners.blur);
        fabric.util.addListener(textarea, 'scroll', this._listeners.scroll);
    }
github nhn / tui.image-editor / src / js / component / shape.js View on Github external
start() {
        const canvas = this.getCanvas();

        this._isSelected = false;

        canvas.defaultCursor = 'crosshair';
        canvas.selection = false;
        canvas.uniScaleTransform = true;
        canvas.on({
            'mouse:down': this._handlers.mousedown
        });

        fabric.util.addListener(document, 'keydown', this._handlers.keydown);
        fabric.util.addListener(document, 'keyup', this._handlers.keyup);
    }
github nhn / tui.image-editor / src / js / component / rotation.js View on Github external
canvas.forEachObject(obj => {
            const objCenter = obj.getCenterPoint();
            const radian = fabric.util.degreesToRadians(angleDiff);
            const newObjCenter = fabric.util.rotatePoint(objCenter, oldImageCenter, radian);

            obj.set({
                left: newObjCenter.x - centerDiff.x,
                top: newObjCenter.y - centerDiff.y,
                angle: (obj.angle + angleDiff) % 360
            });
            obj.setCoords();
        });
        canvas.renderAll();
github nhn / tui.image-editor / src / js / extension / mask.js View on Github external
_createCanvasOfMask(width, height) {
        const maskCanvasEl = fabric.util.createCanvasElement();

        maskCanvasEl.width = width;
        maskCanvasEl.height = height;

        return maskCanvasEl;
    },
github reactioncommerce / reaction / imports / plugins / custom / boxycard-reaction-homepage / client / ui / User / pages / EditorPage / EditorPage.js View on Github external
restoreSVGObject (additionalAction, undoable = false) {
    const modifiedPaths = this.fabricCanvas._objects.filter(object => object.type === 'path');
    const undoOptions = {};

    if (undoable) {
      undoOptions = {
        object: cloneDeep(auxSvgObject),
        type: 'editSvg',
        objectsToRemove: [auxSvgObject]
      };
    }

    if (additionalAction)
      additionalAction(modifiedPaths)

    const group = fabric.util.groupSVGElements(auxSvgObject._objects);

    group.set({
      originalScale: 1,
      cornerSize: CORNER_SIZE,
      hasBorders: true,
      originX: 'center',
      originY: 'center',
      left: auxSvgObject.left,
      top: auxSvgObject.top,
      angle: auxSvgObject.angle,
      flipX: auxSvgObject.flipX,
      flipY: auxSvgObject.flipY
    })
      .scale(2, 2);

    modifiedPaths.forEach(object => {