Pixi.js: Mit WebGL in Safari auf den Kopf stellen

Getestet in Safari / Firefox / Chrome und unten:

seltsam! werde auf jeden Fall mal reinschauen..

Ich scheine ein ähnliches Problem zu haben, wenn die Leinwand in Safari auf den Kopf gestellt wird, während Chrome sie korrekt anzeigt.

Jetzt setze ich baseTexture.flipY = true auf Safari und benutze unten einen schmutzigen Hack, um darüber hinwegzukommen.

diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js
index 05258f6..82b1c84 100644
--- a/src/core/renderers/webgl/WebGLRenderer.js
+++ b/src/core/renderers/webgl/WebGLRenderer.js
@@ -396,6 +396,9 @@ WebGLRenderer.prototype.updateTexture = function (texture)

     gl.bindTexture(gl.TEXTURE_2D, texture._glTextures[gl.id]);

+    if (texture.flipY) {
+        gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, 1);
+    }
     gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, texture.premultipliedAlpha);
     gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, texture.source);

Ich habe ein ähnliches Problem, bei dem ich Sprites zu einem Sprites hinzufüge und dann auf der Leinwand toDataURL() aufrufe. Das zurückgegebene Bild wird bei neueren Safaris vertikal gespiegelt, während ältere Safari (7.1 getestet) und andere Browser ein nicht gespiegeltes Bild zurückgeben. Irgendwelche Vorschläge, wie man das beheben kann?

@holymonson vielleicht einen Test auf einer älteren Safari wert, um zu sehen, ob Sie ein ähnliches Verhalten haben?

Neugierig, ob jemand die Ursache für dieses Problem gefunden hat?

um diesen Thread nicht sterben zu lassen: Ich habe keine Lösung dafür gefunden und musste auf erzwungenes Canvas-Rendering zurückgreifen.

Dies könnte mit dem WebGL-Kontext zusammenhängen premultipliedAlpha ; In meinem Fall kann ich das Problem nur reproduzieren, wenn premultipliedAlpha false für den zweiten Renderer

Ich hasse eine Idee, wie das passieren konnte, aber ich muss sie zuerst reproduzieren.

Hier ist ein reproduzierbarer Fall; betrifft nur Bilder, die mit toDataURL in Safari generiert wurden.
https://jsbin.com/qivife/14/edit?js ,Ausgabe

Gibt es eine Möglichkeit, das nicht gespiegelte Bild mit der toDataURL-API zu exportieren?

@redsend

Es ist nicht garantiert, dass toDataURL und getImageData die richtigen Sachen für WebGL zurückgeben, nicht einmal im Standard. Sie müssen die PIXI-Extrakt-API verwenden:

//if you want canvas
var canvas =renderer.extract.canvas(stage);
//if you want base64
var base64=renderer.extract.base64(stage);

var base64=renderer.extract.base64(Bühne); und var canvas =renderer.extract.canvas(Bühne); Beheben des Problems mit dem Kopf nach unten Aber dann hat sich die Größe der Leinwand geändert und die Hintergrundfarben bleiben nicht erhalten. Irgendwelche Vorschläge

Ich verwende PIXI.RenderTexture, das das Problem mit der Bildgröße behebt, aber die Hintergrundfarbe haftet immer noch nicht

Dieser Thread wurde automatisch gesperrt, da nach dem Schließen in letzter Zeit keine Aktivität stattgefunden hat. Bitte öffnen Sie eine neue Ausgabe für verwandte Fehler.