Können alpha-Transparenz, Füllfarbe oder Pinselstrich-Stil gesetzt werden separat von RGB-in Canvas-HTML5?
In Canvas/HTML5, ich weiß, Sie verwenden können, RGBA-die Farb-und alpha-Transparenz für fillStyle oder strokeStyle. Sie können auch nur RGB-Farbe ohne alpha-Kanal. gibt es eine Möglichkeit, Sie können ändern Sie den alpha-Wert eines Elements, ohne auch liefert die Farbe.
Meinem Beispiel würde wollen, ändern Sie die fillStyle oder strokeStyle über ein canvas-Bereich, dessen Farbe zufällig war oder nicht mehr bekannt ist. Gibt es eine Möglichkeit, ändern Sie das alpha durch ein anderes Attribut oder durch die übergabe nichts zu der Farbe (z.B. ctx.fillStyle = 'rgba(,,,alphaValue)';)
Du musst angemeldet sein, um einen Kommentar abzugeben.
Gibt es ein paar Möglichkeiten.
Erste, der
globalAlpha
- Attribut des Kontext.Als Sie Fragen in dem Titel, wird es ermöglichen, die Transparenz festgelegt werden, unabhängig von Fläche oder Kontur.
Könnte man dann verwenden Sie die
getImageData
auf einen Punkt, um herauszufinden, die Farbe und speichern Sie die info, klar, dass der Bereich mitclearRect
legenglobalAlpha
, und dann neu zeichnen den Bereich mit der Farbe, die Sie gespeichert.Natürlich Sie nicht brauchen
globalAlpha
überhaupt. Sie können auch den vor und statt der Einstellung global alpha, ändern Sie einfach die alpha von der Farbe, die Sie gespeichert.Wenn Sie wollen, um einen großen, komplexen Bereich der Leinwand mehr transparent, dann werden Sie wollen, ändern Sie die globalAlpha und dann ziehen die Leinwand auf sich selbst Verwendung der Methode drawImage.
Hier ist ein Beispiel. Ich zeichne zwei Rechtecke, dann machen Sie einen rechteckigen Bereich zwischen Ihnen transparent werden.
Können Sie eine Funktion verwenden, um zu extrahieren die RGB-Werte aus was auch immer für den Stil, der Sie interessiert, und legen Sie dann mit den gewünschten alpha:
Können Sie eine hexToRgb Funktion wie diese, aufgenommen von diese andere Antwort: