2017-01-16 1 views
0

처리를 사용하고 있으며 디스플레이에있는 픽셀에서 원을 만들려고합니다. 나는 화면에서 픽셀을 끌어 당겨 성장하는 원을 만들었다.처리 중 - 현재 픽셀에서 원 만들기

그러나 나는 훨씬 더 정교한 것을 찾고 있는데, 마치 디스플레이의 픽셀이 현재 위치에서 움직이고있는 것처럼 보이게하고 싶습니다.

이 내가 지금 무엇을 가지고 :

int c = 0; 
    int radius = 30; 
    allPixels = removeBlackP(); 
    void draw { 
    loadPixels(); 
    for (int alpha = 0; alpha < 360; alpha++) 
    { 

     float xf = 350 + radius*cos(alpha); 
     float yf = 350 + radius*sin(alpha); 
     int x = (int) xf; 
     int y = (int) yf; 
     if (radius > 200) {radius =30;break;} 
     if (c> allPixels.length) {c= 0;} 
     pixels[y*700 +x] = allPixels[c]; 
     updatePixels(); 
    } 
    radius++; 
    c++; 
    } 

함수가 검은 사람을 제외한 모든 픽셀 배열을 반환 removeBlackP.

이 코드는 저에게 적합합니다. 서클에는 숫자가 int 인 문제가 있으므로 서클 내부의 일부 픽셀이 채워지지 않는 것처럼 보입니다. 그렇게 살 수 있습니다. 내가 설명했던 것보다 좀 더 복잡한 것을 찾고 있습니다.

감사합니다!

답변

1

원에 속한 주사선의 모든 픽셀을 채 웁니다. 이 접근법을 사용하면 원 안에 모든 장소를 칠합니다. 모든 라인에 대해 시작 좌표를 계산하십시오 (끝은 대칭입니다). 의사 코드는 :

for y = center_y - radius; y <= center_y + radius; y++ 
    dx = Sqrt(radius * radius - y * y) 
    for x = center_x - dx; x <= center_x + dx; x++ 
      fill a[y, x] 

모든 픽셀을위한 장소를 찾을, 당신은 초기 픽셀 장소 및 계산들 사이의 상관 관계를 확인하고 단계별로 이동할 수 있습니다.

예를 들어, k 번째 픽셀의 중심점에 대하여 초기 좌표 (X0, Y0)이며, 최종 좌표 (X1, Y1)이고 사용자가 나선형으로 화소를 이동 M 단계들을 확인하려면 중간 좌표 계산 :

calc values once: 
r0 = Sqrt(x0*x0 + y0*y0) //Math.Hypot if available 
r1 = Sqrt(x1*x1 + y1*y1) 
fi0 = Math.Atan2(y0, x0) 
fi1 = Math.Atan2(y1, x1) 
if fi1 < fi0 then 
    fi1 = fi1 + 2 * Pi; 

for i = 1; i <=M ; i++ 
    x = (r0 + i/M * (r1 - r0)) * Cos(fi0 + i/M * (fi1 - fi0)) 
    y = (r0 + i/M * (r1 - r0)) * Sin(fi0 + i/M * (fi1 - fi0)) 
    shift by center coordinates  
0

가공에서 드로잉 원을 그리는 방법은 약간 복잡합니다.

가장 간단한 방법은 ellipse() 기능을 사용하는 것입니다, 어떤 픽셀이 비록 포함되지 : 당신이 타원을 그리는 픽셀을 사용할 필요가없는 경우

, 당신은 할 수있는 별도의 버퍼를 사용하는 것과 비슷 PGraphics의 사용/"레이어"는 드로잉 프로세싱 명령을 사용하여 드로잉 할 수 있지만 액세스 할 수있는 pixels[]도 있습니다.

저해상도 픽셀 서클 원을 그리려면 작은 PGraphics를 만들고, 부드럽게 해제하고, 원을 그 다음 원을 더 높은 해상도로 렌더링한다고 가정 해 봅시다. 유일한 캐치는이 그리기 명령은 beginDraw()/endDraw() 호출 내에 위치해야한다 :

PGraphics buffer; 

void setup(){ 
    //disable sketch's aliasing 
    noSmooth(); 

    buffer = createGraphics(25,25); 
    buffer.beginDraw(); 
    //disable buffer's aliasing 
    buffer.noSmooth(); 
    buffer.noFill(); 
    buffer.stroke(255); 
    buffer.endDraw(); 
} 
void draw(){ 
    background(255); 

    //draw small circle 
    float circleSize = map(sin(frameCount * .01),-1.0,1.0,0.0,20.0); 
    buffer.beginDraw(); 
    buffer.background(0); 
    buffer.ellipse(buffer.width/2,buffer.height/2, circleSize,circleSize); 
    buffer.endDraw(); 

    //render small circle at higher resolution (blocky - no aliasing) 
    image(buffer,0,0,width,height); 
} 

당신은 수동으로 ((X = COS 직교 변환 공식에 극성을 사용하여 오른쪽에있는 pixels[]를 사용하여 원을 그리려면 angle) * radius, y = sin (각도) * radius). 방사형 그래디언트를 그리는 데 초점을 맞추더라도 this answer

의 픽셀을 사용하여 원을 그리는 예제를 실제로 볼 수 있습니다.