Görüntüleri Karşılaştırmak için Açık Kaynak JavaScript API'si
JavaScript Kitaplığı, Yazılım programcılarının Düğüm veya tarayıcılar vb. gibi birden çok ortamda iki görüntüyü karşılaştırmasını sağlar.
Bazen ne kadar benzer olduklarını görmek için iki görüntüyü karşılaştırmak gerekir. Bu çok karmaşık bir süreçtir ve bunu başarmak için iyi bir bilgi gerekir. Açık kaynak pixelmatch kitaplığı, herhangi bir ortamda iki görüntüyü karşılaştırmak için çok kullanışlı bir seçim olabilir. Kitaplığın hiçbir bağımlılığı olmadığından ve ham yazılı görüntü verisi dizileri üzerinde çalıştığından, Düğüm veya tarayıcılar vb. gibi birden çok ortamda kullanılabilir.
Piksel eşleme, boyut olarak çok küçüktür ve kullanımı çok basittir ancak çok hızlı bir piksel düzeyinde görüntü karşılaştırma kitaplığıdır. JavaScript ile yazılmıştır ve başlangıçta testlerdeki ekran görüntülerini karşılaştırmak için oluşturulmuştur. Kitaplık, kenar yumuşatılmış piksel algılama ve algısal renk farkı ölçümleri gibi özellikleri destekler.
Kenar yumuşatma algılaması çok kullanışlı bir özelliktir çünkü genellikle aynı verilerin farklı uygulamalarda, cihazlarda veya işletim sistemlerinde işlenmesinin biraz farklı sonuçlar üretebileceği gözlemlenmiştir. Ancak daha anlamlı veriler elde etmek için çoğunlukla bu küçük farklılıkların veya testlerin göz ardı edilmesi önerilir.
pixelmatch'e Başlarken
Pixelmatch'i kurmanın önerilen yolu NPM'dir. Lütfen yüklemek için aşağıdaki komutu kullanın.
NPM aracılığıyla pixelmatch yükleyin
npm install pixelmatch Piksel Eşleştirme Testi Nedir?
Aralarında herhangi bir fark olup olmadığını kontrol etmek için iki görüntüyü karşılaştırmanız gerekiyorsa, bu amaçla piksel eşleşme testini kullanabilirsiniz. Orijinal görüntü ve değiştirilmiş görüntü olmak üzere iki tür görüntü olabilir. Uygulamanızın ekran görüntüsünden görüntü alabilen bir uygulama kullanabilirsiniz ve bundan sonra, bu görüntüleri karşılaştırmak ve sonuçları görüntülemek için görüntü karşılaştırma kitaplığı kullanılabilir.
JavaScript Kitaplığı ile Görüntüleri Karşılaştırma
Açık kaynak kitaplık pixelmatch, JavaScript uygulamaları içindeki görüntüleri kolaylıkla karşılaştırmak için eksiksiz bir işlevsellik sağlamıştır. Yazılım geliştiricilerin, karşılaştırma için görüntü verilerinin yanı sıra, görüntü verilerini farklılıklarla birlikte yazması gereken çıktı yerini sağlaması gerekir. Ayrıca, üç görüntünün genişliği ve yüksekliği olan boyutu sağlamaları gerekir. Görüntülerin biraz farklı olmasına izin veren eşik seçeneğini kullanabilirsiniz, bu bazı durumlarda harika olabilir. Lütfen pixelmatch kitaplığının görüntülerin aynı boyutlarda olması gerektiğini unutmayın.
Fotoğraflar Karşılaştırma Online JavaScript API API
const img1 = img1Context.getImageData(0, 0, width, height);
const img2 = img2Context.getImageData(0, 0, width, height);
const diff = diffContext.createImageData(width, height);
pixelmatch(img1.data, img2.data, diff.data, width, height, {threshold: 0.1});
diffContext.putImageData(diff, 0, 0);
Node'deki görüntülerle karşılaştırın. js via Pixelmatch
const fs = require('fs');
const PNG = require('pngjs').PNG;
const pixelmatch = require('pixelmatch');
const img1 = PNG.sync.read(fs.readFileSync('img1.png'));
const img2 = PNG.sync.read(fs.readFileSync('img2.png'));
const {width, height} = img1;
const diff = new PNG({width, height});
pixelmatch(img1.data, img2.data, diff.data, width, height, {threshold: 0.1});
fs.writeFileSync('diff.png', PNG.sync.write(diff));
