我尝试使用CamanJS进行图像处理。我有以下html文件:
<div class="filter-container modal">
<div class="filter">
<div class="filter-img"></div>
</div>
</div>
要创建<img>
i 在 my 中执行以下操作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>
我创建的不存在?我不知道为什么。