ก่อนที่จะมีหน้าจอความละเอียดสูงเกิดขึ้น พิกเซลจริงของหน้าจอนั้นเป็นพิกเซลลอจิคัลที่กำหนดโดย CSS (ประมาณว่ายังไม่มีแนวคิดเกี่ยวกับพิกเซลจริงและพิกเซลลอจิคัลในขณะนั้น) ดังนั้น คุณสามารถใช้โค้ดต่อไปนี้เพื่อแสดง Canvas ขนาด 600x386 ในเบราว์เซอร์
<html> <head> <title>การสาธิต Canvas</title> <style> * { padding: 0; } html, body { width: 100%; สีแดง; ระยะขอบ: 10px auto 0; } </style> </head> <body> <canvas id=canvas width=600 height=386>Canvas ไม่ได้รับการสนับสนุน</canvas> <script> var canvas = document.getElementById('canvas'); var ctx = canvas.getContext('2d'); ctx.beginPath(300, 150, 20, 0, Math.PI*2 ctx.fillStyle = #0095DD; ctx.fill(); ctx.closePath(); </body></html>สรุป
ข้างต้นคือปัญหาและวิธีแก้ปัญหาการเบลอเมื่อใช้ภาพวาด Canvas บนหน้าจอความละเอียดสูงที่โปรแกรมแก้ไขแนะนำ ฉันหวังว่ามันจะเป็นประโยชน์กับคุณ หากคุณมีคำถามใดๆ โปรดฝากข้อความถึงฉัน แล้วโปรแกรมแก้ไขจะตอบกลับ คุณทันเวลา ฉันอยากจะขอบคุณทุกคนที่ให้การสนับสนุนเว็บไซต์ศิลปะการต่อสู้ VeVb!