您的位置:首页 > Web前端 > JavaScript

JavaScript Canvas 根据像素点取位置

2013-11-13 18:16 393 查看
<html>
<body>
<canvas id="canvas" width="100" height="100" style="background-color: #000;"/>

<script>
function position  (x,y){
this.x = x;
this.y = y;
}

var canvas = document.getElementById('canvas'),
ctx = canvas.getContext('2d');
width = canvas.width,
height = canvas.height;
ctx.fillStyle = "#FF0000";
ctx.font = "20px Arial";
ctx.fillText("妈妈",10,50);

var pixs = ctx.getImageData(0,0,width,height).data;
var Pixels = new Array();

for(var i=0;i<pixs.length;i+= 4)
{
var r = pixs[i],
g = pixs[i+1],
b = pixs[i+2],
a = pixs[i+3];

if(r != 0 || g != 0 || b != 0 ){
var x = i%400;
var y = i/400;
Pixels.push(new position(x,y));
}
}

</script>
</body>
</html>


  
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: