在我重置画布的宽度和高度

时间:2017-09-13 20:54:07

标签: javascript html canvas

在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>

我尝试通过两个输入重置画布的宽度和高度,并根据新画布绘制一张新图片。但是,当我单击按钮时,画布会调整大小,但是绘制图片的光线投射功能不起作用。我怎么能让它发挥作用?

0 个答案:

没有答案