달력

07

« 2017/07 »

  •  
  •  
  •  
  •  
  •  
  •  
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  •  
  •  
  •  
  •  
  •  

'2012/OpenGL'에 해당되는 글 2

  1. 2012.11.12 WebGL - Drawing ConvexHull (1)
  2. 2012.10.03 Shader 코드 내부 변수의 Precision
2012.11.12 20:17

WebGL - Drawing ConvexHull 2012/OpenGL2012.11.12 20:17

임의의 점 10개를 생성하여, convexthull을 그려주는 webgl 예제.


아래는 정점 버퍼 초기화 함수. viewport의 크기는 640x480이다.


function initBuffers() {


var maxPoints = 10;
var i = 0
var vertices=[];
var points = [];

while(i!= maxPoints)
{
var vertexElement = [];
vertexElement.push(getRandomInt(0,640));
vertexElement.push(getRandomInt(0,480));
vertexElement.push(0);

points.push(vertexElement[0]);
points.push(vertexElement[1]);
points.push(0);

vertices.push(vertexElement);
i++;
}

var convexVertcies = [];
convexVertcies = getConvexHull(vertices);


var newVertices = [];
for (var idx in convexVertcies) {
var temp = convexVertcies[idx];

for (var i in temp) {
newVertices.push(temp[i][0]);
newVertices.push(temp[i][1]);
newVertices.push(temp[i][2]);
}

}

console.log(newVertices);
console.log(points);

lineBuffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, lineBuffer);
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(newVertices), gl.STATIC_DRAW);

lineBuffer.itemSize = 3;
lineBuffer.numItems = newVertices.length / lineBuffer.itemSize;

pointsBuffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, pointsBuffer);
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(points), gl.STATIC_DRAW);

pointsBuffer.itemSize = 3;
pointsBuffer.numItems = maxPoints;

}

아래는 convexhull을 만드는 함수. x좌표의 최소값과 최대값을 찾고, 두 개를 기준으로 상단 convexhull과 하단을
만든 후 결합한다. 알고리즘은 quickhull이라 불리는 것을 가져옴. 근데 이게 진짜 정확한 방식인지는 모르겠으나, 
여러번 테스트 결과는 이상없이 결과 나옴.

function getDistant(cpt, bl) {
var Vy = bl[1][0] - bl[0][0];
var Vx = bl[0][1] - bl[1][1];
return (Vx * (cpt[0] - bl[0][0]) + Vy * (cpt[1] -bl[0][1]))
}


function findMostDistantPointFromBaseLine(baseLine, points) {
var maxD = 0;
var maxPt = new Array();
var newPoints = new Array();
for (var idx in points) {
var pt = points[idx];
var d = getDistant(pt, baseLine);

if ( d > 0) {
newPoints.push(pt);
} else {
continue;
}

if ( d > maxD ) {
maxD = d;
maxPt = pt;
}

}
return {'maxPoint':maxPt, 'newPoints':newPoints}
}

var allBaseLines = new Array();
function buildConvexHull(baseLine, points) {

allBaseLines.push(baseLine)
var convexHullBaseLines = new Array();
var t = findMostDistantPointFromBaseLine(baseLine, points);
if (t.maxPoint.length) { // if there is still a point "outside" the base line
convexHullBaseLines =
convexHullBaseLines.concat(
buildConvexHull( [baseLine[0],t.maxPoint], t.newPoints)
);
convexHullBaseLines =
convexHullBaseLines.concat(
buildConvexHull( [t.maxPoint,baseLine[1]], t.newPoints)
);
return convexHullBaseLines;
} else { // if there is no more point "outside" the base line, the current base line is part of the convex hull
return [baseLine];
}
}

function getConvexHull(points) {
//find first baseline
var maxX, minX;
var maxPt, minPt;
for (var idx in points) {
var pt = points[idx];
if (pt[0] > maxX || !maxX) {
maxPt = pt;
maxX = pt[0];
}
if (pt[0] < minX || !minX) {
minPt = pt;
minX = pt[0];
}
}
var ch = [].concat(buildConvexHull([minPt, maxPt], points),
buildConvexHull([maxPt, minPt], points))
return ch;
}

결과는 다음과 같다.


전체 소스 코드는 아래에서 확인~

https://github.com/airyym/webgl/blob/master/triangulation.html




저작자 표시
신고
TAG webgl
Posted by 에어림
2012.10.03 18:08

Shader 코드 내부 변수의 Precision 2012/OpenGL2012.10.03 18:08

갤럭시 s2에서 OpenGL ES 2.0으로 영상처리 코드 구현중에 gl_FragCoord와 Viewport 사이즈를 이용해서 처리할 일이 생겼는데, 쉐이더 코드 내에서 대용량의 이미지를 처리할 경우에 연산 결과를 임시로 저장해야 할 필요가 있었다. 


근데 스펙상 precision을 mediump로 할 경우, float 의 크기가 고작 2^15 까지밖에 저장을 못하게 되어있다. 물론 highp로 precision을 높여도 되지만 여러가지 실험 결과, 갤럭시 s2의 OpenGL ES 의 스펙이 highp를 지원하지 않는 걸로 생각된다. 

크로노스의 스펙 문서에서도 highp 의 구현은 optional 로 지정되어 있으니 아마도 highp가 자동으로 downsizing 이 된게 아닌가 싶다.

 

문제는 컴파일은 이상없이 된다는 점이다. 그러다가 다른 오류 때문에 컴파일이 안될 경우 나오는 오류 메시지에

highp가 지원되지 않는다는 문구가 떡하니 포함되게 된다... 참으로 골때리는 NDK..


그러나 정작 해결은 전혀 엉뚱한 곳에서 됐으니.... 무려 2주간을 삽질로 날리는 결과 ㅠ 



저작자 표시
신고
TAG OpenGL ES
Posted by 에어림


티스토리 툴바