//get DPI
let dpi = window.devicePixelRatio;
//get canvas
let canvas = document.getElementById('myCanvas');
//get context
let ctx = canvas.getContext('2d');
function fix_dpi() {
//get CSS height
//the + prefix casts it to an integer
//the slice method gets rid of "px"
let style_height =
+getComputedStyle(canvas).getPropertyValue("height").slice(0, -2);
//get CSS width
let style_width =
+getComputedStyle(canvas).getPropertyValue("width").slice(0, -2);
//scale the canvas
canvas.setAttribute('height', style_height * dpi);
canvas.setAttribute('width', style_width * dpi);
}
Category: HTML5
how to read an array in javascript in HTML5
<body>
<h1>Creating Arrays</h1>
<h2>Regular:</h2>
<script language="JavaScript">
// Create the array.
var Colors = new Array();
// Fill the array with data.
Colors[0] = "Blue";
Colors[1] = "Green";
Colors[2] = "Purple";
// Display the content onscreen.
document.write(Colors);
</script>
<h2>Condensed:</h2>
<script language="JavaScript">
// Create the array and fill it with data.
var Colors = new Array("Blue", "Green", "Purple");
// Display the content onscreen.
document.write(Colors);
</script>
<h2>Literal:</h2>
<script language="JavaScript">
// Create the array and fill it with data.
var Colors = ["Blue", "Green", "Purple"];
// Display the content onscreen.
document.write(Colors);
</script>
</body>