任意の地図画像を3D空間にしようとしています。
しかし、エラーが出て、なぜエラーが出るのかもはやわからないです。
どうか、ご協力お願いいたします。
<!DOCTYPE html>
<html>
<head>
<title>Ray-caster</title>
<script type="text/javascript" src="/folder_canvas2/trace.js"></script>
<link rel="stylesheet" type="text/css" href="/folder_canvas2/trace.css" />
<script type="text/javascript" src="/folder_canvas2/input.js"></script>
<script type="text/javascript" src="/folder_canvas2/Player.js"></script>
<script type="text/javascript" src="/folder_canvas2/Level.js"></script>
<script type="text/javascript" src="/folder_canvas2/RayCaster.js"></script>
<img src=/folder_canvas2/map.jpg id=aaa>
<script type="text/javascript">
document.onload = function() {
var canvas = document.getElementById("aaa");
var ctx = canvas.getContext("2d");
var img = new Image();
img.src = "/folder_canvas2/map.jpg";
img.onload = function() {
ctx.drawImage(img, 0, 0);
var src = ctx.getImageData(0, 0, canvas.width, canvas.height);
var dst = ctx.createImageData(canvas.width, canvas.height);
var x=width;
var y=height;
var pixel = new Array();
for (var i=0; i<width; i++){ pixel[i] = new Array();}
pixel[x][y] = (src.data[i] + src.data[i+1] + src.data[i+2]) / 3;
for(var y=1; y<height; y++){
for(var x=1; x<width; x++){
for (var i = 0; i < src.data.length; i=i+4) {
dst.data[i] = dst.data[i+1] = dst.data[i+2] = pixel;
dst.data[i+3] = src.data[i+3];
if(pixel<150){
pixel[x][y]="#";
}
}
}
}
ctx.putImageData(dst, 0, 0);
};
for(var x=1; x<width; x++){
pixel[x][1]="#";
pixel[x][height]="#";}
}
</script>
<canvas id="c1" width="width" height="height">
<script type="text/javascript">
var C2D, W, H, RC;
var fps = 24;
var mspf = 1000 / fps;
var updateInterval;
var quit = false;
function main() {
var c = document.getElementById('canvas');
if (c.getContext) {
initializeCanvas(c);
var P = new Player(8);
var L = new Level();
RC = new RayCaster(C2D, W, H, 4, L, P, input);
if (initializeLevel()) {
trace('map loaded successfully.');
trace("now casting...");
trace(" \'a\' - turn left");
trace(" \'d\' - turn right");
trace(" \'w\' - step forward");
trace(" \'s\' - step backward");
trace(" \'q\' - stop casting");
updateInterval = window.setInterval("update()", mspf);
}
else {
trace("map failed to load");
}
}
else {
trace('sorry.. you\'ll need a browser that supports the canvas tag,');
trace('like Safari or Firefox 1.5+ to see this demo.');
}
}
function initializeCanvas(c) {
C2D = c.getContext('2d');
C2D.lineWidth = 1;
C2D.globalAlpha = 1;
C2D.globalCompositeOperation = 'source-over';
W = c.width;
H = c.height;
trace('canvas initialized');
}
function initializeLevel() {
var mapCells_x = height;
var mapCells_y = weidht;
var M = '' +
pixel[100][200]='p';
for(var y=1; y<height; y++){
for(var x=1; x<width; x++){
'pixel[x][y]';}}
trace('submitting map...');
return RC.loadMap(M, mapCells_x, mapCells_y);
}
</script>
<style type="text/css">
canvas {
border: 2px solid #000;
position: absolute;
left: 33%;
margin-left: 10px;
}
</style>
</head>
<body onload="main();" onkeydown="press(event);" onkeyup="release(event);">
<div id="trace" class="window"><ul><li>RayCaster v.0.0.1</li></ul></div>
<canvas id="canvas" width="320" height="240"></canvas>
</body>
</html>
下記のエラーコードが出るのですが、まったくわからないです。
VM64 stage.html:103 Uncaught ReferenceError: Invalid left-hand side in assignment
VM65 stage.html:126 Uncaught ReferenceError: main is not defined
Q&A
ベストアンサー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/02/15 07:59