enikesha
/
old


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233
							<!--
	demo.design 3D programming FAQ

	Idea, texts, screenshots:
		Andrew A. Aksyonoff,
		shodan@chat.ru

	Web-design, illustrations:
		Andrey Samoilov,
		asy@sense.simbirsk.su
-->

<html>
<head>
<title>demo.design 3D programming FAQ. Текстурирование. Перспективно-корректное.</title>
<link rel=stylesheet href="../style.css" type="text/css">
</head>

<script language="javascript">
<!--//
browser = navigator.appName;
version = parseFloat(navigator.appVersion);
if (browser == "Netscape" && version >= 3.0) { jsenabled = 1; } else
if (browser == "Microsoft Internet Explorer" && version >= 3.0) { jsenabled = 1; } else { jsenabled = 0; }

function swap(img,ref) { if (jsenabled) {document.images[img].src = ref;} }
function loadtocache(img,ref) { cache[img] = new Image(); cache[img].src = ref; }

if (jsenabled) {
cache = new Array();
loadtocache(0,"../img/xdl.gif");
loadtocache(1,"../img/xfaq.gif");
loadtocache(2,"../img/xlinks.gif");
loadtocache(3,"../img/xauthor.gif");
loadtocache(4,"../img/xe.gif");
loadtocache(5,"../img/xprev.gif");
loadtocache(6,"../img/xnext.gif");}
//-->
</script>

<body bgcolor=white><center>

<!-- Title -->

<img src="../img/b.gif" width=500 height=1 alt=""><br>
<img src="../img/t.gif" width=500 height=1 alt=""><br>
<img src="../img/b.gif" width=500 height=1 alt=""><br>
<img src="../img/t.gif" width=500 height=2 alt=""><br>
<table width=500 cellpadding=0 cellspacing=0 border=0>
<td><img src="../img/t.gif" width=5 height=1 alt=""><a href="../main.htm" onmouseover="swap('logo','../img/xe.gif');" onmouseout="swap('logo','../img/e.gif');"><img src="../img/e.gif" name=logo width=60 height=50 hspace=10 border=0 alt=" в самое начало "></a></td>
<td><p class=pagetitle><img src="../img/t.gif" width=265 height=1 alt=""><br>demo.design<br>3D programming FAQ</td>
<td align=center><p class=navy><a href="../download.htm" onmouseover="swap('dl','../img/xdl.gif');" onmouseout="swap('dl','../img/dl.gif');"><img src="../img/dl.gif" name=dl width=40 height=40 border=0 hspace=5 alt=" download "></a><br>download</td>
<td align=center><p class=navy><a href="../links.htm" onmouseover="swap('links','../img/xlinks.gif');" onmouseout="swap('links','../img/links.gif');"><img src="../img/links.gif" name=links width=40 height=40 border=0 hspace=5 alt=" коллекция линков "></a><br>links</td>
<td align=center><p class=navy><a href="../author.htm"  onmouseover="swap('author','../img/xauthor.gif');" onmouseout="swap('author','../img/author.gif');"><img src="../img/author.gif" name=author width=40 height=40 border=0 hspace=5 alt=" автора! "></a><br>author</td>
</table>
<img src="../img/t.gif" width=500 height=4 alt=""><br><img src="../img/b.gif" width=500 height=1 alt=""><br>

<!-- Head -->

<table width=500 cellpadding=0 cellspacing=10 border=0><td><div align=justify>

<p class=title>
<img src="../img/b4.gif" width=70 height=70 align=left hspace=0 alt="">
<img src="../img/t.gif" width=5 height=70 align=left hspace=0 alt="">
ТЕКСТУРИРОВАНИЕ<br>4.3. Перспективно-корректное

<!-- Article -->

<p>Этот метод основан на приближении u, v кусочно-линейными функциями. Кратко
говоря, при рисовании каждая строка разбивается на куски (обычно несколько
кусков длиной 8/16/32 пикселов и один оставшийся произвольной длины), в
начале и конце каждого куска считаются точные значения u, v, а на куске
они интерполируется линейно.

<p>Точные значения u и v, в принципе, можно считать по формулам из 4.1, но
обычно используют более простой путь. Он основан на том факте, что значени
1/Z, u/Z и v/Z зависят от sx, sy ЛИНЕЙНО. Доказательство этого факта пока
опущено. Таким образом, достаточно для каждой вершины посчитать 1/Z, u/Z,
v/Z и линейно их интерполировать - точно так же, как интерполируются u и v
в 4.2. Причем, так как эти значения зависят от sx, sy строго линейно, то
интерполяция дает не сильно приближенные результаты, а абсолютно точные!

<p>Сами же точные значения u, v считаются как

<p class=expression>u = (u/Z) / (1/Z),<br>
v = (v/Z) / (1/Z).<br>

<p>Дальше все становится совсем просто. При рисовании треугольника, на ребрах
интерполируем не u и v, как в <a href="42.htm">4.2</a>, а 1/Z, u/Z, v/Z. Кроме того, заранее
считаем d(u/Z)/dsx, d(v/Z)/dsx, d(1/Z)/dsx (то есть, изменений этих самых
u/Z, v/Z, 1/Z соотвествующих шагу по dsx на 1) так, как считали du/dsx - это
будет нужно для быстрого вычисления точных значений u, v. Каждую линию рисуем
кусками по 8/16/32 пикселов (на самом деле, кусками любой длины; просто если
длина - степень двойки, то при вычислении du/dx и dv/dx для текущего куска
можно деление на длину куска заменить сдвигом вправо) и, если надо, рисуем
оставшийся хвостик. Для расчета точных значений u, v в конце каждого куска
пользуемся посчитанными (ага!) значениями d(u/Z)/dsx, d(v/Z)/dsx, d(1/Z)/dsx;
раз значения u/Z, v/Z, 1/Z в начале куска известны, меняются они линейно и
длина куска известна (либо 16 пикселов, либо длина остатка), то в конце
куска они считаются все это до боли просто:

<pre class=source>
// расчет u/Z, v/Z, 1/Z в конце куска
uZ_b = uZ_a + length * duZ_dsx;
vZ_b = vZ_a + length * dvZ_dsx;
Z1_b = Z1_a + length * dZ1_dsx;
</pre>

<p>Все вместе выглядеть это будет примерно так:

<pre class=source>
// ...
current_sx = x_start;
length = x_end - x_start;

// расчет u/Z, v/Z, 1/Z, u, v в начале самого первого куска
uZ_a = uZ_start;
vZ_a = vZ_start;
Z1_a = Z1_start; // это 1/Z
u_a = uZ_a / Z1_a;
v_a = vZ_a / Z1_a;

// рисуем куски по 16 пикселов
while (length >= 16) {
  // расчет u/Z, v/Z, 1/Z, u, v в конце куска
  uZ_b = uZ_a + 16 * duZ_dsx;
  vZ_b = vZ_a + 16 * dvZ_dsx;
  Z1_b = Z1_a + 16 * dZ1_dsx;
  u_b = uZ_b / Z1_b;
  v_b = vZ_b / Z1_b;

  u = u_a; // начинаем текстурирование с начала куска
  v = v_a;
  // можно сделать >> 4, используя fixedpoint
  du = (u_b - u_a) / 16;
  dv = (v_b - v_a) / 16;

  // рисуем 16 пикселов старым добрым "аффинным" методом
  len = 16;
  while (len--) {
    putpixel(current_sx, current_sy, texture[(int)v][(int)u]);
    u += du;
    v += dv;
    current_sx++;
  }
  length -= 16;

  // конец куска становится началом следующего куска
  uZ_a = uZ_b;
  vZ_a = vZ_b;
  Z1_a = Z1_b;
  u_a = u_b;
  v_a = v_b;
}

// дорисовываем "хвост" линии, если он непуст
if (length != 0) {
  uZ_b = uZ_a + length * duZ_dsx;
  vZ_b = vZ_a + length * dvZ_dsx;
  Z1_b = Z1_a + length * dZ1_dsx;
  u_b = uZ_b / Z1_b;
  v_b = vZ_b / Z1_b;

  u = u_a; // начинаем текстурирование с начала куска
  v = v_a;
  du = (u_b - u_a) / length;
  dv = (v_b - v_a) / length;

  // рисуем остаток пикселов старым добрым "аффинным" методом
  while (length--) {
    putpixel(current_sx, current_sy, texture[v][u]);
    u += du;
    v += dv;
    current_sx++;
  }
}
// ...
</pre>

<p>Как и в <a href="42.htm">4.2</a>, пройдемся подобным куском кода по всем строкам грани, не забыв
вместо "// ..." вставить интерполяцию всяких там [u/v/1]Z_start, содранную
с интерполяции u_start.. и - о чудо, текстурированная с учетом перспективы
грань!

<p>Осталось сказать еще пару слов о кое-какой оптимизации.

<p>Во-первых, два деления при расчете u и v в цикле прорисовки можно (и нужно)
заменить на одно - посчитать tmp = 1/Z, дальше u = uZ * tmp, v = vZ * tmp.

<p>Во-вторых, немного поменяв местами блоки расчета очередной пары точных
значений u и v и прорисовки очередного куска линии, можно добиться того,
что это самое одно деление, нужное для расчета u и v для *следующего* куска
будет находиться сразу перед прорисовкой *текущего* куска. А в этом случае
деление может исполняться в сопроцессоре одновременно с отрисовкой куска
линии в процессоре. То есть единственная медленная операция будет считатьс
на полную халяву! Получим перспективно-корректное текстурирование, которое
(теоретически) будет работать ненамного медленнее аффинного.

<p>В-третьих, деление на length при дорисовке хвостика длиной от 1 до 15
пикселов можно заменить на умножение на 1/length, заранее посчитав табличку
для значений 1/length.

<p>И наконец, мелкие треугольники можно текстурировать аффинным методом, а
большие - методом с коррекцией. Размер треугольника можно определять хот
бы по длине самой длинной горизонтальной линии:

<p class=expression>x_start = A.sx+(B.sy-A.sy)*(C.sx-A.sx)/(C.sy-A.sy),<br>
x_end = B.sx,<br>
longest_length = x_end - x_start,<br>

<p>все равно мы ее считаем для расчета du_dsx или duZ_dsx и иже с ними.

</div>
</td></table>

<!-- Bottom Navigation -->

<img src="../img/b.gif" width=500 height=1 alt=""><br><img src="../img/t.gif" width=500 height=2 alt=""><br>
<table width=500 cellpadding=0 cellspacing=0 border=0>
<td><img src="../img/t.gif" width=5 height=1 alt=""><a href="../main.htm" onmouseover="swap('logo2','../img/xe.gif');" onmouseout="swap('logo2','../img/e.gif');"><img src="../img/e.gif" name=logo2 width=60 height=50 hspace=10 border=0 alt=" в самое начало "></a></td>
<td><p class=pagetitle><img src="../img/t.gif" width=265 height=1 alt=""><br>demo.design<br>3D programming FAQ</td>
<td align=center><p class=navy><a href="42.htm" onmouseover="swap('prev','../img/xprev.gif');" onmouseout="swap('prev','../img/prev.gif');"><img src="../img/prev.gif" name=prev width=40 height=40 border=0 hspace=5 alt=" предыдущая статья "></a><br>previous</td>
<td align=center><p class=navy><a href="../content.htm" onmouseover="swap('faq','../img/xfaq.gif');" onmouseout="swap('faq','../img/faq.gif');"><img src="../img/faq.gif" name=faq width=40 height=40 border=0 hspace=5 alt=" содержание "></a><br>content</td>
<td align=center><p class=navy><a href="44.htm" onmouseover="swap('next','../img/xnext.gif');" onmouseout="swap('next','../img/next.gif');"><img src="../img/next.gif" name=next width=40 height=40 border=0 hspace=5 alt=" следующая статья "></a><br>next</td>
</table>
<img src="../img/t.gif" width=500 height=4 alt=""><br>
<img src="../img/b.gif" width=500 height=1 alt=""><br>
<img src="../img/t.gif" width=500 height=1 alt=""><br>
<img src="../img/b.gif" width=500 height=1 alt=""><br>


</center></body>
</html>