williammalo/README.md

## README.md

      
    Raw
  

              README.md
            
          
    converts canvas image data to a 2d array of booleans
array=img2array(imagedata,width,height)
array[x][y]  //gives true or false
very useful for games where you need pixel perfect collision.
Reading an image every time you check for collision is slow. Using a 2d array makes it much faster, and has a very simple syntax (array[x][y]) .
Game engine using image to 2d array conversion:
http://maloweb.com/snippets/terraindemo

  
## annotated.js
function(a,w,h,i,j,l){
  l=[];                            //initiate array
    for(i=0;i<w;i++){              //loop through all x positions
      l[i]=[];                     //make a new array
      for(j=0;j<h;j++)             //loop through all y positions
        l[i][j]=a[j*w+i<<2]<128    //fill l[x][y] with boolean (with a black and white image, black is true, white is false)
    }
    return l                       //return the array
}

## index.js
function(a,w,h,i,j,l){l=[];for(i=0;i<w;i++){l[i]=[];for(j=0;j<h;j++)l[i][j]=a[j*w+i<<2]<128}return l}

## package.json
{
  "name": "img2array",

  "description": "converts an canvas image data to a 2d array of booleans",

  "keywords": [
    "canvas",
    "image",
    "2d",
    "array"
  ]
}

## test.html
<!DOCTYPE html>
<title>Foo</title>
<div>Expected value: <b>undefined</b></div>
<div>Actual value: <b id="ret"></b></div>
<script>
  // write a small example that shows off the API for your example
  // and tests it in one fell swoop.

  var myFunction = function(){ /* the code here should be identical to the entry. */ }

  document.getElementById( "ret" ).innerHTML = myFunction()
</script>
	function(a,w,h,i,j,l){
	l=[]; //initiate array
	for(i=0;i<w;i++){ //loop through all x positions
	l[i]=[]; //make a new array
	for(j=0;j<h;j++) //loop through all y positions
	l[i][j]=a[j*w+i<<2]<128 //fill l[x][y] with boolean (with a black and white image, black is true, white is false)
	}
	return l //return the array
	}
	{
	"name": "img2array",

	"description": "converts an canvas image data to a 2d array of booleans",

	"keywords": [
	"canvas",
	"image",
	"2d",
	"array"
	]
	}
	<!DOCTYPE html>
	<title>Foo</title>
	<div>Expected value: <b>undefined</b></div>
	<div>Actual value: <b id="ret"></b></div>
	<script>
	// write a small example that shows off the API for your example
	// and tests it in one fell swoop.

	var myFunction = function(){ /* the code here should be identical to the entry. */ }

	document.getElementById( "ret" ).innerHTML = myFunction()
	</script>