在js文件中:
function main_part2() {
var canvas = document.getElementById("viewport");
var context = canvas.getContext("2d");
var eye = new Vector(0.5, 0.5, -0.5);
raycasting(context, eye, PART2);
}
function change_size() {
var canvas = document.getElementById("viewport");
var width = document.getElementById("width").value;
var height = document.getElementById("height").value;
canvas.width = width;
canvas.height = height;
main_part2();
}
在html文件中:
<body onload="main_part2();">
<canvas id="viewport" width="512" height="512" style="background-color: black"></canvas><br><br>
<label for="width">Width: </label><input id="width" type="number"><br><br>
<label for="height">Height: </label><input id="height" type="number"><br><br>
<button type="submit" onclick="change_size()">Change</button>
我尝试通过两个输入重置画布的宽度和高度,并根据新画布绘制一张新图片。但是,当我单击按钮时,画布会调整大小,但是绘制图片的光线投射功能不起作用。我怎么能让它发挥作用?