解决canvas高分屏下显示不清晰的问题
最近不经意间用iPad打开了我的博客,一位高糊的血小板朋友进入了我的直播间,突然间意识到这是个Canvas,应该是绘制的时候由于高清屏描绘的像素不一样,本应该是1px渲染的,有的却2px渲染
那么就直接上代码啦
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
var styleW = 280;
var styleH = 280;
var dpr= window.devicePixelRatio || window.webkitDevicePixelRatio || window.mozDevicePixelRatio || 1;
if(dpr) {
canvas.width = Math.round(styleW * dpr);
canvas.height = Math.round(styleH * dpr);
canvas.style.width = styleW + 'px';
canvas.style.height = styleH + 'px';
}
本作品采用 知识共享署名-相同方式共享 4.0 国际许可协议 进行许可。