HTML5 Canvas and blurry rendering. devicePixelRatio is needed

Afraid I can’t use DOM. But I got it to work with the below (after a lot of fiddling!).

<script type="text/javascript">
	
  	var scale =  window.devicePixelRatio;
  
  	if(scale==1){
  		lime.embed("openfl-content", 0, 0, "FFFFFF");
  	}
    else{
     
      w = window.innerWidth;
      h = window.innerHeight;
 
      lime.embed("openfl-content", w*2, h*2, "FFFFFF");

      var canvas = document.getElementById ("openfl-content").firstChild;

      canvas.style.width = String(w)+"px";
      canvas.style.height =  String(h)+"px";
      context = canvas.context2d;
      context.translate(.5,.5);
    }
  	
  	
</script>
1 Like