无法找到初始化的图像或画布

Caman: Could not find image or canvas for initialization

本文关键字：图像 初始化      更新时间：2023-09-26

我尝试使用CamanJS进行图像处理。我有以下html文件:

<div class="filter-container modal">
    <div class="filter">
        <div class="filter-img"></div>
    </div>
</div>
要创建<img>，我在filter.js中执行以下操作: 
initialize: function (options) {
    var self = this;
    self.options = options;
    self.promise = $q.defer();
    self.loadImage().then(function (elem) {
        self.imgWidth = elem.naturalWidth;
        self.imgHeight = elem.naturalHeight;
        self.imgOriginal = elem.cloneNode();
        self.imgFilter = elem.cloneNode();
        self.options.modal.el.querySelector(".filter-img").appendChild(self.imgFilter);
    });
    self.options.cancel = this.cancel.bind(this);
    self.options.filter = this.filter.bind(this);
    self.options.previousFilter = this.previousFilter.bind(this);
    self.options.nextFilter = this.nextFilter.bind(this);
},
loadImage: function () {
    var promise = $q.defer();
    angular.element("<img />")
        .bind("load", function (e) {
            promise.resolve(this);
        })
        .bind("error", promise.reject)
        .prop("src", this.options.url)
        .prop("id", IMAGE_ID);
    return promise.promise;
},

当我现在想测试一个过滤器:

performFilter: function () {
    Caman(IMAGE_ID, function () {
        this.brightness(10);
        this.contrast(30);
        this.sepia(60);
        this.saturation(-30);
        this.render();
    });
}

我得到错误信息:

Could not find image or canvas for initialization.

所以对我来说，这意味着我创建的<img>不存在?我不知道为什么。

交换这一行:

Caman(IMAGE_ID, function() {

Caman(this.imgFilter, function() {
相关文章：