algorytm.org

Implementacja w JavaScript



Baza Wiedzy
wersja offline serwisu przeznaczona na urządzenia z systemem Android
Darowizny
darowiznaWspomóż rozwój serwisu
Nagłówki RSS
Artykuły
Implementacje
Komentarze
Forum
Bookmarki






Sonda
Implementacji w jakim języku programowania poszukujesz?

Zmiana wielkości obrazu - Interpolacja dwuliniowa - Implementacja w JavaScript
Ocena użytkownikóww: *****  / 1
SłabyŚwietny
Nadesłany przez Tomasz Lubiński, 07 grudnia 2011 21:07
Kod przedstawiony poniżej przedstawia główną część rozwiązania problemu.
Pobierz pełne rozwiązanie.

Jeżeli nie odpowiada Ci sposób formatowania kodu przez autora skorzystaj z pretty printer'a i dostosuj go automatycznie do siebie.

bli.js:
//Skalowanie obrazów - interpolacja dwuliniowa
//(c) 2011 by Tomasz Lubinski
//www.algorytm.org

/* Data of the image */
var imageData;
var width;
var height;

/* Bilinear Interpolation algorithm */
function bilinearInterpolation(scaleX, scaleY)
{
	var canvas = document.getElementById("canvas");
	var ctx = canvas.getContext("2d");

	// set new size
	canvas.width = width * scaleX / 100.0;
	canvas.height = height * scaleY / 100.0;
	
	// perform bilinear interpolation algorithm
	var ratiox = (width*1.0)/(canvas.width*1.0);
	var ratioy = (height*1.0)/(canvas.height*1.0);
	var newImageData = ctx.createImageData(canvas.width, canvas.height);
	
	for (var i=0; i<canvas.height; i++)
	{
		for (var j=0; j<canvas.width; j++)
		{
			var x = j*ratiox;
			var y = i*ratioy;
			var x0 = Math.floor(x);
			var y0 = Math.floor(y);
  			var dx = x - x0;
  			var dy = y - y0;
  			var x1 = x0 + 1;
  			var y1 = y0 + 1;  			
  			if (x1 >= width) x1 = x0;
  			if (y1 >= height) y1 = y0;
			var indexSrc00 = (y0*width+x0)*4;
			var indexSrc01 = (y0*width+x1)*4;
			var indexSrc10 = (y1*width+x0)*4;;
			var indexSrc11 = (y1*width+x1)*4;;
			var indexDst = (i*canvas.width+j)*4;

			newImageData.data[indexDst+0] = 
				(1.0-dy) * ((1.0-dx)*imageData.data[indexSrc00+0] + dx*imageData.data[indexSrc01+0]) +
				dy       * ((1.0-dx)*imageData.data[indexSrc10+0] + dx*imageData.data[indexSrc11+0]);
			newImageData.data[indexDst+1] = 
				(1.0-dy) * ((1.0-dx)*imageData.data[indexSrc00+1] + dx*imageData.data[indexSrc01+1]) +
				dy       * ((1.0-dx)*imageData.data[indexSrc10+1] + dx*imageData.data[indexSrc11+1]);
			newImageData.data[indexDst+2] = 
				(1.0-dy) * ((1.0-dx)*imageData.data[indexSrc00+2] + dx*imageData.data[indexSrc01+2]) +
				dy       * ((1.0-dx)*imageData.data[indexSrc10+2] + dx*imageData.data[indexSrc11+2]);
			newImageData.data[indexDst+3] = 
				(1.0-dy) * ((1.0-dx)*imageData.data[indexSrc00+3] + dx*imageData.data[indexSrc01+3]) +
				dy       * ((1.0-dx)*imageData.data[indexSrc10+3] + dx*imageData.data[indexSrc11+3]);
		}
	}

	// copy the image data back onto the canvas
	ctx.putImageData(newImageData, 0, 0);	
}

/* load image pointed by param_file to canvas */
function loadImage(imgSrc) 
{
	var canvas = document.getElementById("canvas");
	var ctx = canvas.getContext("2d");
	
	// add file:// if user specified local path
	if (imgSrc.indexOf("//") == -1 && imgSrc.indexOf(".") != 0) 
	{
		imgSrc = "file:///" + imgSrc;
	}
	
	// load file into canvas
	var img = new Image();
  	img.onload = function(){
		width = img.width;
		height = img.height;
 		canvas.width = width;
  		canvas.height = height;
    		ctx.drawImage(img,0,0);
		// get image data
		try 
		{
    			imageData = ctx.getImageData(0, 0, width, height);
  		} catch(e) 
  		{
  			netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
  			imageData = ctx.getImageData(0, 0, width, height);
  		}
  	}
  	img.src = imgSrc;
}
Dodaj komentarz