2011-03-29 2 views
1

OpenGL ES 2.0 (WebGL) 및 JS를 사용하는 드로잉 응용 프로그램을 마칩니다. 매우 빠른 움직임으로 그리지 않으면 모든 것이 잘 작동합니다.마우스 스무딩을 구현하는 가장 효율적인 방법

Faceted loop

이 루프는 부드러운 움직임으로 그려했지만, JS는 특정 위치에서 마우스의 측정 값을 얻을 만 할 수 있었기 때문에, 결과는 기리됩니다 : 아래 그림을 참조하십시오. PS가 훨씬 더 높은 속도로 폴링 할 수 있기 때문에 분명히 훨씬 적지 만 마우스 스무딩을 해제 한 경우 포토샵에서 어느 정도 발생합니다.

그래서 일부 마우스 스무딩을 구현하고 싶습니다.하지만 실제로 픽셀 그리기 작업을 중단시키지 않도록 매우 효율적인지 확인해야합니다. 원래 JS가 스플라인을 생성하고 판독 값을 보간하여 매끄러운 결과를 얻을 수있는 마우스 위치를 사용하려고 생각했습니다. 그래도이게 최선의 방법인지는 모르겠다. 그렇다면 중간 스플라인에서 정확한 위치를 샘플링하려면 어떻게해야합니까? 제가 발견 한 스플라인 방정식의 대부분은 t = [0, 1]에 대해 균일하게 분산 된 값을 가지고 있지 않습니다.

어떤 도움/조언/조언을 주시면 감사하겠습니다. 감사!

답변

2

Catmull-Rom은 아직 시도하지 않은 경우 시도해 보는 것이 좋습니다.

http://www.mvps.org/directx/articles/catmull/

I 최소 세그먼트 길이를 선택하고 1 + segmentLength/minSegmentLength 서브 세그먼트로 그 위에있는 부분을 분할 할 것이다.

+0

실제로 Catmull-Rom 스플라인을 사용하여이 작업을 수행했지만 간격이 제대로 작동하지 않습니다. 문제는 방정식에서 t를 제어하여 새로운 점을 얻을 수 있지만 t의 0.5 값은 반드시 두 종점 사이의 중간 (또는 일반적으로)이 아닙니다. 내가 뭔가를 놓치지 않는 한, 각 하위 세그먼트에 대해 적절한 거리를 스플라인을 따라 이동하려면 이진 검색을 수행해야 할 것 같습니까? – Xenethyl

+0

t = 0.5에 대한 점은 두 점 사이의 경로 중간에 있어야합니다. 그것은 반드시 포인트 사이의 중간 지점 근처에있는 것은 아니지만 이것은 정상입니다. 스플라인의 점은 우연히 만나는 것을 제외하고는 모든 스플라인에 균등하게 간격을 두지 않습니다. 매개 변수로 접선이있는 스플라인에 미치는 영향을 최소화하려고 시도 할 수 있지만 커브 양식이 크게 달라집니다. 손으로 그린 ​​스케치를 보간 할 때, 간단한 Catmull-Rom이 일반적으로 충분합니다. 그것은 잘 알려져 있고, 잘 테스트되었으며, "단지 효과가있다"고합니다. – Damon

+0

@Damon t = 0.5 인 지점은 두 지점 사이의 경로 중간에 있지 않습니다. t 매개 변수는 호 길이와 전혀 상관 관계가 없습니다. 보간 점이 곡선을 따라 균등하게 배치되도록 적절한 t 값을 선택하려면 다른 함수를 사용하여 다시 매개 변수화해야합니다. 이 재 매개 변수화는 정확히 싸지는 않아서 대안을 찾고있었습니다. 그렇게 말하면서, 나는 t에 대해 받아 들일 수있는 스테핑을 추정 할 수 있고 너무 작 으면 초과 값을 버릴 수 있다고 생각합니다. 나는 이것을 받아 들일 것입니다 - 토론 친구들에게 감사드립니다. – Xenethyl

관련 문제