1. Tuotteet
  2.   Kuva
  3.   Node.js
  4.   LooksSame
 
  

Ilmainen Node.js API kuvien vertailuun

Avoimen lähdekoodin Node.js-pohjainen API, joka vertaa kuvia pikseleiltä. Tehokas, joustava ja tehokas ratkaisu kuvien vertailuun Node.js-sovelluksissa.

Kuvien vertailulla on keskeinen rooli ohjelmistokehityksessä, erityisesti sellaisilla aloilla kuin visuaalinen regressiotestaus, kuvanlaadun varmistus ja pikselin täydellisen suunnittelun todentaminen. Olitpa sitten kehittämässä ohjelmistoa, joka varmistaa käyttöliittymän yhtenäisen ulkonäön useilla alustoilla tai automatisoida visuaalisia tarkastuksia tuotantoprosessissa, tehokas kuvien vertailutyökalu on välttämätön. LooksSame, Gemini-Testingin kehittämä avoimen lähdekoodin API, yksinkertaistaa kuvien vertailuun tarkoitettujen ohjelmistojen luomista sen intuitiivisilla ominaisuuksilla. Kirjastossa on useita tärkeitä ominaisuuksia, kuten kuvapisteiden välinen vertailu, aliasoinnin tunnistus, toleranssin säätö, kuvan mittojen käsittely, lupausten tuki ja paljon muuta.

LooksSame on Node.js-pohjainen sovellusliittymä, joka on suunniteltu kuvien vertailuun. Sen avulla kehittäjät voivat verrata kuvia pikseliltä ja vaihtoehtoja käsitellä pieniä muunnelmia, joita saattaa ilmetä renderöintiympäristöjen eroista. Hyödyntämällä kirjastoa ohjelmistokehittäjät voivat rakentaa omia sovelluksiaan, jotka havaitsevat merkittäviä visuaalisia eroja unohtamatta kuitenkaan triviaaleja muunnelmia. API on ensisijaisesti keskittynyt auttamaan kehittäjiä ylläpitämään johdonmukaisuutta käyttöliittymäsuunnittelussa, mutta sen monipuolisuus tekee siitä sopivan moniin muihin kuvien vertailukäyttötapauksiin. Selkeän API:n ja muokattavissa olevien vaihtoehtojensa ansiosta LooksSame on loistava lisä minkä tahansa kehittäjän työkalupakkiin, erityisesti verkkopohjaiseen käyttöliittymätestaukseen, automaattiseen kuvien luomiseen ja muihin skenaarioihin, joissa visuaalinen tarkkuus on ensiarvoisen tärkeää.

Previous Next

LooksSamen käytön aloittaminen

Suositeltava tapa asentaa LooksSame on käyttää NPM:ää. Käytä seuraavaa komentoa sujuvaan asennukseen.

Asenna LooksSame NPM:n kautta

npm install looks-same

Peruskuvavertailu Node.js-sovelluksissa

Avoimen lähdekoodin LooksSame-kirjaston avulla ohjelmistokehittäjät voivat helposti suorittaa peruskuvavertailuja Node.js-sovelluksissa. Asennuksen jälkeen voit verrata kahta kuvaa vaatimalla LooksSame-moduulin koodissasi. Tässä on perusesimerkki, joka näyttää, kuinka kirjastoa käytetään tarkistamaan, ovatko kaksi kuvaa visuaalisesti identtisiä: Tässä esimerkissä vertaa kuvaa1.png ja image2.png. Jos ne ovat visuaalisesti samat, yhtäläinen palauttaa tosi; muussa tapauksessa se palauttaa epätosi.

Kuinka vertailla kahta kuvaa Node.js-sovelluksissa?

const looksSame = require('looks-same');

// Compare two images
looksSame('image1.png', 'image2.png', (error, { equal }) => {
    if (error) {
        console.error('Error comparing images:', error);
    } else if (equal) {
        console.log('Images are identical!');
    } else {
        console.log('Images differ!');
    }
});

Toleranssiin perustuva kuvien vertailu

Ohjelmistojen kehittäjät voivat lisätä toleranssitason sovelluksille, jotka eivät vaadi pikselin täydellisiä osumia. Tämä mahdollistaa pienten kuvien välisten erojen, kuten eri selaimissa tai käyttöjärjestelmissä tapahtuvien renderöinnin aiheuttamien muutosten, huomioimisen. Seuraavassa koodiesimerkissä toleranssiksi on asetettu 5 %, mikä tarkoittaa, että pienet pikselivaihtelut (jopa 5 %) eivät aiheuta kuvien katsomista erilaisiksi.

Kuinka tehdä toleranssiin perustuvaa kuvien vertailua Node.js-sovelluksissa?

cfunction compareWithTolerance(image1, image2, toleranceLevel) {
    looksSame(image1, image2, { tolerance: toleranceLevel }, (error, { equal }) => {
        if (error) {
            console.error('Error comparing images:', error);
        } else if (equal) {
            console.log('Images are visually identical within tolerance!');
        } else {
            console.log('Images differ!');
        }
    });
}

// Usage
compareWithTolerance('image1.png', 'image2.png', 5);  // 5% tolerance

Erilaisten alueiden korostaminen

Kehittyneemmille sovelluksille ohjelmistokehittäjät saattavat haluta tunnistaa ja analysoida vain tiettyjä eroavaisuuksia. LooksSame-kirjasto tarjoaa rajoitusruutuominaisuuden, joka näyttää tarkan alueen, jossa eroja esiintyy. Tämä toiminto tulostaa eri alueiden rajapintakoordinaatit, mikä helpottaa tarkentamista kuvan tiettyihin osiin, jotka ovat muuttuneet. Seuraava esimerkki näyttää, kuinka rajauslaatikon koordinaatteja käytetään kuvien vertailuun ja erojen korostamiseen.

Kuinka vertailla Kuvien tiettyjen alueiden välisiä eroja Node.js-sovellusten avulla?

function compareWithDiffBounds(image1, image2) {
    looksSame(image1, image2, (error, { diffBounds }) => {
        if (error) {
            console.error('Error comparing images:', error);
        } else {
            console.log('Bounding box of differences:', diffBounds);
        }
    });
}

// Usage
compareWithDiffBounds('image1.png', 'image2.png');

Aliasoinnin tunnistus tarkkoja vertailuja varten

Avoimen lähdekoodin LooksSame-kirjaston avulla ohjelmistokehittäjät voivat pakata kuvia käyttämällä Anti-Aliasing Detection -menetelmää Node.js-sovelluksissa. Anti-aliasing voi aiheuttaa vääriä positiivisia kuvia vertailtaessa, koska se aiheuttaa pieniä eroja reunan renderöinnissa. Kirjaston ignoreAntialiasing-vaihtoehto auttaa välttämään nämä väärät positiiviset tulokset. Tämä on erityisen hyödyllistä sovelluksissa, joissa kuvat voidaan hahmontaa eri tavalla eri laitteissa tai selaimissa, mutta ne ovat silti visuaalisesti samoja.

 Suomen