1. Producten
  2.   Afbeelding
  3.   JavaScript
  4.   Color Thief
 
  

Open Source JavaScript-bibliotheek voor beeldverwerking

JavaScript API om kleurenpalet uit afbeeldingen te halen.

Wat is kleurendief?

Color Thief is een zeer eenvoudige lichtgewicht bibliotheek voor beeldverwerking waarmee softwareontwikkelaars kleur uit afbeeldingen kunnen halen met behulp van JavaScript. Het is een pure JavaScript-bibliotheek die zowel op Node als in de browser kan werken zonder externe afhankelijkheden. De API Haalt de dominante kleur uit de afbeelding. Kleur wordt geretourneerd als een matrix van drie gehele getallen die rode, groene en blauwe waarden vertegenwoordigen. Terwijl u in de browser werkt, moet u een HTML-afbeelding gebruiken voor verwerking en terwijl u de Node gebruikt, moet u de URL van de afbeelding gebruiken.

Het Color Thief-pakket bevat meerdere distributiebestanden om verschillende omgevingen en bouwprocessen te ondersteunen. color-thief.js is het hoofdbestand voor het verwerken van de afbeeldingen, color-thief.mjs wordt gebruikt voor moderne browsers, evenals voor Webpack en Rollup, en color-thief.umd.js wordt gebruikt voor het eenvoudig laden van scripttags.

Previous Next

Aan de slag met Color Thief

De aanbevolen manier om Color Thief via NPM te installeren. Gebruik de volgende opdracht om het te installeren.

Installeer Color Thief via NPM

 npm i --save colorthief

Krijg kleuren van afbeelding via gratis JavaScript API

Met de open-source Color Thief-bibliotheek kunnen JavaScript-ontwikkelaars kleuren programmatisch uit de afbeeldingen extraheren. Om de dominante kleur van de afbeelding te krijgen, biedt de API getColor() methode. De methode haalt de dominante kleur uit de afbeelding. Kleur wordt geretourneerd als een matrix van drie gehele getallen die rode, groene en blauwe (RGB) waarden vertegenwoordigen. Door de volgende twee regels code te gebruiken, kunt u gemakkelijk de dominante kleur uit de afbeelding halen.

Dominante kleur uit afbeelding halen

  1. Afbeelding laden
  2. Krijg kleur

Kleur extraheren uit de afbeelding in Node.js

const img = resolve(process.cwd(), 'rainbow.png');
ColorThief.getColor(img)
.then(color => { console.log(color) })
.catch(err => { console.log(err) })

Krijg Color Platte van afbeelding via gratis JavaScript API

Met behulp van de API kunt u ook een kleurenpalet uit de afbeeldingen halen. Om een kleurenpalet uit de afbeelding te halen, biedt de API de getPalette()-methode. De methode haalt een palet uit de afbeelding door vergelijkbare kleuren te clusteren. Het palet wordt geretourneerd als een array met kleuren, waarbij elke kleur zelf een array van drie gehele getallen is. Door de volgende twee regels code te gebruiken, kunt u eenvoudig een kleurplaat van de afbeelding krijgen.

Haal Color Platte uit Afbeelding

  1. Afbeelding laden
  2. Krijg kleurplaat

Kleurplaatafbeelding extraheren in Node.js

const img = resolve(process.cwd(), 'rainbow.png');
ColorThief.getPalette(img, 5)
.then(palette => { console.log(palette) })
.catch(err => { console.log(err) })
 Dutch