孤独的猫

  博客园 :: 首页 :: 新随笔 :: 联系 :: 订阅 :: 管理 ::

processing贝塞尔曲线

在贝塞尔曲线上写文字,文字沿着曲线路径书写

 1 PFont myfont;
 2 String str= " 创意编程能做什么?任何你想象的交互图形和互动装置。";
 3 float t ;
 4 int num=str.length();                               //指定字符的个数
 5 float [ ]x = new float [num];                       //创建字符x坐标的数组
 6 float [ ]y = new float [num];                       //创建字符y坐标的数组
 7 void setup() {
 8   size(800, 480);  
 9   myfont = createFont("STLITI.TTF", 24);
10   textAlign(CENTER);
11   textFont(myfont);
12   noFill();
13 }
14 
15 void draw() {
16   background(#00B272);                                    //设置绿色背景
17   bezier(70, 300, 300, -200, 450, 560, 710, 200);        //设置曲线参数
18   for (int i=0; i<num; i++) {
19     x[i] = bezierPoint(70, 300, 450, 710, t);            //曲线上点的x坐标
20     y[i] = bezierPoint(300, -200, 560, 200, t);           //曲线上点的y坐标
21     float tx = bezierTangent(100, 300, 450, 600, t);      //求出切线方向x分量
22     float ty = bezierTangent(200, -200, 500, 200, t);     //求出切线方向y分量
23     float radian = atan2(ty, tx);                     //根据切线方向分量求出角度
24     pushMatrix();
25     translate(x[i], y[i]);                           //坐标系移到曲线上点的位置
26     rotate(radian);                                  //坐标系旋转
27     text(str.charAt(i), 0, 0);                       //分别显示字符
28     t = i*0.04;
29     popMatrix();
30   }
31 }

 

 

posted on 2024-06-10 10:21  孤独的猫  阅读(82)  评论(0)    收藏  举报