angular-fabric icon indicating copy to clipboard operation
angular-fabric copied to clipboard

Add options to an image object?

Open molnsys opened this issue 9 years ago • 1 comments

I have implemented a ng-file-drop directive that encodes the image to URL data (base64) and then I put the image on the canvas

// add the encoded file to the canvas $scope.fabric.addImage(encodedFile);

Now I am trying to add options to the image, but I can't see if options for Fabrics.Image is implemented.

From Fabric docs: var imgElement = document.getElementById('my-image'); var imgInstance = new fabric.Image(imgElement, { left: 100, top: 100, angle: 30, opacity: 0.85 });

This is what I tried in my controller when I add the image:

// add the encoded file to the canvas $scope.fabric.addImage(encodedFile,imageDefaults: {left: 100, top: 100, angle: 30, opacity: 0.85});

And this:

$scope.fabric.addImage(encodedFile, {left: 100, top: 100, angle: 30, opacity: 0.85});

The image is added to the canvas but with no options. No error.

Maybe I can add it to the active object and use fabric.selectedObject.xxx and implement the missing options in fabric.js with a setter. Something like this: self.selectedObject.options = self.setOptions();

I have found where the function for adding Image is in fabric.js:

// Image
    // ==============================================================
    self.addImage = function(imageURL) {
        fabric.Image.fromURL(imageURL, function(object) {
            object.id = self.createId();

            for (var p in self.imageOptions) {
                object[p] = self.imageOptions[p];
            }

But I don't understand if ImageOptions is implemented and how to set options.

molnsys avatar May 15 '15 13:05 molnsys

I also get the same question!

HeliWang avatar Oct 08 '16 01:10 HeliWang