Atvērtā pirmkoda JavaScript API attēlu salīdzināšanai
JavaScript bibliotēka ļauj programmatūras programmētājiem salīdzināt divus attēlus vairākās vidēs, piemēram, mezglā vai pārlūkprogrammās utt.
Dažreiz ir jāsalīdzina divi attēli, lai redzētu, cik līdzīgi tie ir. Tas ir ļoti sarežģīts process, un, lai to paveiktu, bija nepieciešamas labas zināšanas. Atvērtā pirmkoda pixelmatch bibliotēka var būt ļoti noderīga izvēle divu attēlu salīdzināšanai jebkurā vidē. Tā kā bibliotēkai nav atkarību un tā darbojas uz neapstrādātiem attēlu datu masīviem, tāpēc to var izmantot vairākās vidēs, piemēram, mezglā vai pārlūkprogrammās utt.
Pixelmatch ir ļoti maza izmēra un ļoti vienkārši lietojams, taču tā ir ļoti ātra pikseļu līmeņa attēlu salīdzināšanas bibliotēka. Tas ir rakstīts JavaScript un sākotnēji izveidots, lai salīdzinātu ekrānuzņēmumus testos. Bibliotēka atbalsta tādas funkcijas kā anti-aliased pikseļu noteikšana un uztveres krāsu atšķirību metrika.
Anti-aliasing noteikšana ir ļoti noderīga funkcija, jo parasti ir novērots, ka vienādu datu renderēšana dažādās lietojumprogrammās, ierīcēs vai operētājsistēmās var radīt nedaudz atšķirīgus rezultātus. Bet lielākoties ir ieteicams ignorēt šīs nelielās atšķirības vai testus, lai iegūtu nozīmīgākus datus.
Darba sākšana ar pixelmatch
Ieteicamais pixelmatch instalēšanas veids ir NPM. Lūdzu, izmantojiet šo komandu, lai to instalētu.
Instalējiet pixelmatch, izmantojot NPM
npm install pixelmatch
Kas ir pikseļu atbilstības pārbaude?
Ja jums ir jāsalīdzina divi attēli, lai pārbaudītu, vai starp tiem ir kāda atšķirība, šim nolūkam varat izmantot pikseļu atbilstības pārbaudi. Var būt divu veidu attēli — sākotnējais attēls un pārveidotais attēls. Varat izmantot lietojumprogrammu, kas var ienest attēlus no jūsu lietotnes ekrānuzņēmuma, un pēc tam attēlu salīdzināšanas bibliotēku var izmantot, lai salīdzinātu šos attēlus un parādītu rezultātus.
Attēlu salīdzināšana, izmantojot JavaScript bibliotēku
Atvērtā koda bibliotēka pixelmatch ir nodrošinājusi pilnīgu funkcionalitāti, lai viegli salīdzinātu attēlus JavaScript lietojumprogrammās. Programmatūras izstrādātājiem ir jānodrošina attēla dati salīdzināšanai, kā arī izvades vieta, kur jāieraksta attēla dati ar atšķirībām. Viņiem arī jānorāda izmērs, kas ir trīs attēlu platums un augstums. Varat izmantot sliekšņa opciju, kas ļauj attēliem nedaudz atšķirties, kas dažos gadījumos var būt lieliski. Lūdzu, ņemiet vērā, ka pixelmatch bibliotēkai ir nepieciešams, lai attēliem būtu vienādi izmēri.
Attēlu salīdzinājums tiešsaistē, izmantojot JavaScript 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);
Salīdziniet attēlus pakalpojumā Node.js, izmantojot 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));