Tumblr에 Processing 포스팅 하기

저는 텀블러(Tumblr)라고 하는 블로깅 서비스를 사용하고 있는데요. 오늘은 텀블러에 프로세싱(Processing)을 포스팅하는 방법에 대해 알아보도록 하겠습니다.

방법은 무척 쉽습니다. 텀블러의 포스팅 종류를 Text로 선택하고 아래 소스코드 안에 프로세싱 코드를 포함하여 입력하시면 됩니다.

1
2
3
4
5
6
7
8
9
10
11
<script src="https://github.com/downloads/processing-js/processing-js/processing-1.4.1.min.js"></script>
<script type="text/processing" data-processing-target="processing-canvas-hello">
void setup() {
size(320, 340);
}
void draw() {
ellipse(width / 2, height / 2, 50, 50);
}
</script>
<canvas id="processing-canvas-hello"> </canvas>

다음의 두 가지 항목만 유의하시기 바랍니다.

  • script 태그의 data-processing-target 속성값과 canvas 태그의 id 속성값은 임의로 주어도 되지만 둘은 항상 같아야 합니다. ex) “processing-canvas-hello”
  • 각 게시물마다 위의 속성값들이 달라야 합니다. 왜냐하면 여러 게시물에 하나의 페이지에 표시될 경우 캔버스의 ID가 겹치므로 제대로 표시되지 않을 수 있습니다.

이제 프로세싱 공부도 열심히 하고, 블로그에 자랑도 해보아요~ ㅎㅎ

Share Comments