2015-01-09 2 views
0

멀리서 점 구름을 볼 때 모든 점이 겹쳐서 연속적인 서페이스 느낌을 주는데, 이는 내가 달성하려고하는 효과입니다. 그러나 클라우드에 가까워 질수록 개별 점 사각형과 그 사이의 간격을 볼 수 있습니다. 어떻게 이러한 격차를 없앨 수 있습니까? 예를 들어 카메라가 작아지면 포인트 크기를 더 크게 만들 수 있습니까?구름 사이의 틈새를 없앱니다. 가까워지면 더 크게 만듭니다.

여기는 working example입니다. 위쪽 화살표를 눌러 확대하면 결국 연속적인 "구름"이 아닌 개별 점이 표시됩니다.

그런데 더 많은 문맥이 필요하면 here이 질문에 대한 자세한 버전이 있습니다.

감사

니얼

답변

0

아마 불필요하게 자세한 방법으로, the particle vertex shader for my Cubes에서 이런 짓을했습니다.

// Compute pixel scale for points 
vec4 testPosition = eyePosition; 
testPosition.x = uPixelsPerClipUnit.x/uTileSize * 1.2/*appearance fudge factor*/; 
testPosition.y = 0.0; 
testPosition = uPMatrix * testPosition; 
gl_PointSize = testPosition.x/testPosition.w * animationScale; 

이 사용자가 제공해야하는 변수 (u로 시작하는 것들 내가 유니폼으로했다)입니다

  • eyePosition 방금 ​​전에 눈 공간에서 점의 위치 (즉이다 투영 행렬이 적용되고, 모델/뷰 행렬/행렬이 적용된 후). 우리가 실제로 신경 쓰는 부분은 z 축입니다.

  • uPixelsPerClipUnit 절반 뷰포트 픽셀 치수로 설정되어 vec2 - 그것은 픽셀 − 일대일 클립 공간 스케일에서 단지 변환율이다.

  • uTileSize 및 은 포인트가 얼마나 큰지에 대한 내 게임의 매개 변수입니다. 그들은 두 곳의 다른 장소에있을 필요가 없습니다.

  • uPMatrix은 프로젝션 매트릭스입니다. 점의 z 깊이, 투영 행렬을 설정

    • 눈 - 우주 클립 공간 규모의 제품을 받고 우리가 실제로 여기에서하고있는

  • 클립식 우주 픽셀 스케일

및 포인트 크기를 설정하는 것을 사용.

(나는 독립적 인 동작하는 예제를 제공하고 싶습니다,하지만 난 그것을 주변에 얻을 것이다 생각하지 않는다 당신은 조각 절반 구운 설명을 얻을 수 있도록.)

+0

놀라운 - 감사합니다 - 나는 그것을 줄 것이고 내가 일하게되면 알려주지. 나는 WebGL의 최후에 여기에있다. 그래서 약간의 조언을 얻는 것이 좋다. – nrob

+0

eyePosition의 출처가 어디인지 알지 못합니다. 그것은 당신의 편의를 위해 threejs/webgl이 만드는 마법의 변수 중 하나일까요? 아니면 당신이 쉐이더로 전달한 것입니까? 그것은 내 쉐이더에 존재하지 않는 것 같아요. – nrob

+0

'eyePosition'은 제 3 버전의'cameraPosition'에 미리 정의되어 있어야한다고 생각합니다.그건 그렇고, 누군가'modelMatrix','modelViewMatrix','projectionMatrix','viewMatrix','normalMatrix'가 정확히 무엇인지에 대한 정의에 대한 링크가 있다면 그것은 내 인생을 훨씬 더 즐겁게 만들 것입니다. 어디에서나 정보를 찾을 수 있습니다. 왜 그것이 비밀 같은 것 같지 않은지! – nrob

관련 문제