documentでpixel[x][y]が表示がされなくて困っています。値は入力されていると思うのですが、まったく表示されないです。
お願いします。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>test</title>
<script type="text/javascript"></script>
<script type="text/javascript" src="canvas.js"></script>
</head>
<body>
<img src=/test/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 = "/test/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]="#";
}
else{
pixel[x][y]="0";
}
}
}
}
ctx.putImageData(dst, 0, 0);
};
for(var x=1; x<width; x++){
pixel[x][1]="#";
pixel[x][height]="#";}
document.write("<p>");
for(var y=1; y<height; y++){
for(var x=1; x<width; x++){
document.write("pixel[x][y]");}}
document.write("</p>");
}
</script>
</body>
</html>
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。