Automattic/node-canvas

Use standard Canvas `ctx.filter` API (blur/grayscale/saturate/contrast)

Open

#1063 aperta il 21 dic 2017

Vedi su GitHub
 (19 commenti) (24 reazioni) (0 assegnatari)JavaScript (1140 fork)batch import
FeatureHelp wanted

Metriche repository

Star
 (9524 star)
Metriche merge PR
 (Merge medio 34g 18h) (2 PR mergiate in 30 g)

Descrizione

HTML5 Canvas recently introduced support for filters like ctx.filter = "blur(5px)"; in the browser, for example to blur, saturate, grayscale and modify contrast.

Issue or Feature

API support for HTML5 Canvas ctx.filter from from MDN web docs

Steps to Reproduce

var Canvas = require('canvas');
var canvas = Canvas.createCanvas(200, 200);
var ctx = canvas.getContext('2d');
ctx.filter = "blur(5px)";
ctx.drawImage(img,0,0);

Your Environment

  • node-canvas: 2.0.0 alpha
  • node: v9.3.0
  • macOS: High Sierra

Guida contributor

Direzione di ricerca
Indaga come node canvas attualmente elabora i filtri ed esplora il supporto integrato di Cairo per i filtri. Implementa ctx.filter mappando le funzioni di filtro CSS agli equivalenti di Cairo.
Tech stack
javascriptnodejs
Dominio
backendapi
Tipo issue
Funzionalità
DifficoltàQuanto dovrebbe essere impegnativa per un nuovo contributor.
3
Tempo stimatoTempo stimato per completare e verificare uno scope piccolo.
Mezza giornata
Stato attivitàQuanto è probabile che la issue sia ancora attiva e reviewable.
Attiva
ChiarezzaQuanto chiaramente la issue descrive problema, scope e risultato atteso.
Chiara
Prerequisiti
JavaScriptNode.js
Adatta ai principiantiQuanto la issue è adatta a contributor alla prima esperienza.
60