SVG เปลี่ยนสีเมื่อหมุนใน Safari 10

109

ฉันเพิ่งพบปัญหาแปลก ๆ ที่ปรากฏใน Safari 10 เท่านั้นฉันมีการ์ดเล่นภาพ svg ซึ่งบางครั้งก็หมุนโดยใช้transform:rotate(xdeg).

การ์ดที่ฉันใช้มีรูปแบบบล็อกสีแดง เมื่อมันไม่หมุนหรือหมุนเป็นมุมฉากเช่น 90, 180, 270 ก็จะดูปกติ แต่มุมอื่น ๆ ที่ไม่ใช่พื้นหลังจะเปลี่ยนเป็นสีน้ำเงิน! ฉันเพิ่งได้รับรายงานเกี่ยวกับเรื่องนี้จากผู้ใช้คนหนึ่งของฉันและไม่เคยเห็นอะไรแปลก ๆ เบราว์เซอร์อื่น ๆ ทั้งหมดทำงานได้ตามปกติ Safari 9 ทำงานได้ตามปกติ

ฉันเดาว่านี่เป็นเพียงข้อผิดพลาดแปลก ๆ ใน Safari 10 แต่มีความคิดเกี่ยวกับวิธีการแก้ไขหรือไม่ ฉันได้สร้าง repro ขั้นต่ำที่:

https://jsfiddle.net/2zv4garu/1/

— Einar Egilsson
แหล่งที่มา

พิจารณาเพิ่มจุดบกพร่องของ WebKit ในตัวติดตามข้อบกพร่องหากคุณคิดว่านี่เกี่ยวข้องกับ WebKit

— ผ่อนคลาย

สิ่งนี้ไม่ได้เกิดขึ้นกับ Mac Mini รุ่นปลายปี 2012 หรือบน Retina MacBook Pro ปี 2013 ของฉัน Mac Mini: imgur.com/zdAZoWV

— X-Istence

ไม่เกิดขึ้นกับ MacBook Pro Late 11 ที่ไม่ใช่เรตินาของฉันพร้อม Safari เวอร์ชัน 10.0 (12602.1.50.0.10)

— Dave

ยังไม่เกิดขึ้นใน Sierra, iMac ปลายปี 2015 - imgur.com/a/e2FyS

— antonone

ไม่สามารถทำซ้ำใน Safari บน iOS 10.0.1

— Šime Vidas

บั๊กแปลก ๆ แน่นอน การดำเนินการเปลี่ยนแปลงในการตัดgองค์ประกอบเป็นการแปลง SVG ไม่สามารถแก้ไขปัญหาได้

อย่างไรก็ตามการหมุน 3 มิติแทนการหมุน 2 มิตินั่นคือinlineCard.style.transform = 'rotate3d(0,0,1,' + e.currentTarget.value + 'deg)';ช่วยแก้ปัญหาได้คุณสามารถดูได้ที่นี่

https://jsfiddle.net/qe00s1mg/

— วิธีการ
แหล่งที่มา

ขอบคุณที่ใช้งานได้ดี :) ฉันพบว่าการเปลี่ยนสีเกิดขึ้นได้อย่างไรมันเปลี่ยนค่า R และ B จากสีเติม สีคือ # ff0000 และเปลี่ยนเป็น # 0000ff ฉันลองใช้ค่า R และ B ที่แตกต่างกันและเห็นว่ามันเป็นค่าผกผันเสมอ อย่างไรก็ตามค่า G ไม่เปลี่ยนแปลงในความเป็นจริงหากคุณลองใช้สี # 00FF00 สีการ์ดจะไม่เปลี่ยนระหว่างการหมุน อย่างไรก็ตามขอบคุณสำหรับวิธีแก้ปัญหาฉันได้ทำเครื่องหมายคำตอบนี้ว่ายอมรับแล้ว

— Einar Egilsson

โปรดส่งข้อบกพร่องที่ bugreport.apple.com (หรือ bugs.webkit.org) พร้อมรายละเอียดเหล่านั้น

— Paul Schreiber

@EinarEgilsson: ... และนั่นก็อธิบายได้ว่าเกิดอะไรขึ้น เห็นได้ชัดว่ามีคนใช้ลำดับไบต์ที่ไม่ถูกต้องเมื่อแสดงภาพที่หมุน

— Ilmari Karonen

@PaulSchreiber ดูเหมือนว่าจะได้รับการแก้ไขแล้ว แต่คนที่มี Safari 10 รุ่นใหม่กว่าดูเหมือนจะไม่ได้รับสิ่งนี้

— Einar Egilsson

@DarioOO เพราะครึ่งหนึ่งดีกว่าไม่พยายาม

— jpa