[work 107] Polygon & Bezier curve ver.2

[work 107] Polygon & Bezier curve ver.2

Movie

Source code

about

  • 多角形(ここでは三角形)をベジェ曲線で描く
  • アンカーポイントを中心にコントロールポイントを回転させる
  • 2点間の曲線を20分割する
  • 隣り合った曲線の分割した点同士を直線で結ぶ

file

  • 上部にあるファイル名が表示されているボタンを押すと、表示されるファイルが切り替わります
  • 別ウィンドウ表示したい時や行番号などが無いRawMode表示したい時は、コード内右上のボタンを押してください(ボタンはマウスオーバーすると表示されます)
#include "ofMain.h"
#include "ofApp.h"

//================================
int main( ){

    // 4K:4096x2160
    // 2K:2048x1080
    // FullHD:1920x1080
    // HD:1440x1080
    // HD720p:1280x720
    // DVD:720x480
    // setup the GL context
    ofSetupOpenGL(1280, 720, OF_WINDOW);

	// this kicks off the running of my app
	// can be OF_WINDOW or OF_FULLSCREEN
	// pass in width and height too:
	ofRunApp( new ofApp());

}
#pragma once

#include "ofMain.h"
#include "Shape.hpp"


class ofApp : public ofBaseApp{
public:
    ofApp();
    ~ofApp();
    
    void setup();
    void update();
    void draw();
    
    void keyPressed(int key);
    void keyReleased(int key);
    void mouseMoved(int x, int y);
    void mouseDragged(int x, int y, int button);
    void mousePressed(int x, int y, int button);
    void mouseReleased(int x, int y, int button);
    void mouseEntered(int x, int y);
    void mouseExited(int x, int y);
    void windowResized(int w, int h);
    void dragEvent(ofDragInfo dragInfo);
    void gotMessage(ofMessage msg);
    
private:
    std::shared_ptr<Shape> shape;
};
#include "ofApp.h"


ofApp::ofApp(){
    
}

ofApp::~ofApp(){
    
}

//--------------------------------------------------------------
void ofApp::setup(){
    double fps = 30;
    
    ofSetFrameRate(fps);
    ofBackground(0);
    ofSetBackgroundAuto(true);
    ofSetVerticalSync(true);
    
    ofEnableSmoothing();
    
    shape = make_shared<Shape>();
    shape->setup();
}

//--------------------------------------------------------------
void ofApp::update(){
    shape->update();
}

//--------------------------------------------------------------
void ofApp::draw(){
    ofPushMatrix();
    ofTranslate(ofGetWidth() / 2, ofGetHeight() / 2);
    shape->display();
    ofPopMatrix();
}

//--------------------------------------------------------------
void ofApp::keyPressed(int key){
    if (key == 's') {
        ofImage img;
        img.grabScreen(0, 0, ofGetWidth(), ofGetHeight());
        img.save("screenshot.png");
    }
}
#ifndef Shape_hpp
#define Shape_hpp

#include <stdio.h>
#include "ofMain.h"


class Shape {
public:
    Shape();
    ~Shape();
    void setup();
    void update();
    void display();
    
private:
    void setPolygon(int n);
    
    float size;
    std::vector<ofVec2f> points;
    std::vector<int> angles;
    std::vector<ofVec2f> controls;
    std::vector<std::vector<ofVec2f>> bezierPoint;
};
#endif /* Shape_hpp */
#include "Shape.hpp"


Shape::Shape()
{
    
}


Shape::~Shape()
{
    
}


void Shape::setup()
{
    setPolygon(3);
    
    for (int i = 0; i < points.size(); i++) {
        int next = (i + 1) % points.size();
        ofVec2f dir = (points.at(next) - points.at(i)) * ofRandom(0.5, 1.5);
        
        std::array<int, 4> v{-2, -1, 1, 2};
        angles.push_back(v.at((int)ofRandom(v.size())));
        ofVec2f ci = dir;
        controls.push_back(ci);
        
        angles.push_back(v.at((int)ofRandom(v.size())));
        ofVec2f cn = dir * -1;
        controls.push_back(cn);
    }
}


void Shape::update()
{
    if (ofGetFrameNum() > 0) {
        for (int i = 0; i < controls.size(); i++) {
            controls.at(i).rotate(angles.at(i));
        }
    }

    bezierPoint.clear();
    for (int i = 0; i < points.size(); i++) {
        int next = (i + 1) % points.size();
        int ctrlIdx = i * 2;
        ofVec2f ci = points.at(i) + controls.at(ctrlIdx);
        ofVec2f cn = points.at(next) + controls.at(ctrlIdx + 1);
        
        std::vector<ofVec2f> bp;
        for (int j = 1; j < 20; j++) {
            float step = 0.05;
            ofVec2f d;
            d = ofBezierPoint(points.at(i), ci, cn, points.at(next), step * j);
            bp.push_back(d);
        }
        bezierPoint.push_back(bp);
    }
}


void Shape::display()
{
    ofPushMatrix();
    ofNoFill();
    ofSetLineWidth(1);
    ofSetColor(255);
    ofBeginShape();
    for (int i = 0; i < points.size(); i++) {
        int next = (i + 1) % points.size();
        int ctrlIdx = i * 2;
        ofVec2f ci = points.at(i) + controls.at(ctrlIdx);
        ofVec2f cn = points.at(next) + controls.at(ctrlIdx + 1);
        
        if (i == 0) {
            ofVertex(points.at(i));
            ofBezierVertex(ci, cn, points.at(next));
        } else {
            ofBezierVertex(ci, cn, points.at(next));
        }
    }
    ofEndShape();
    
    ofNoFill();
    ofSetLineWidth(1);
    ofSetColor(255);
    for (int i = 0; i < bezierPoint.size(); i++) {
        int next = (i + 1) % bezierPoint.size();

        ofBeginShape();
        int index = 0;
        while(index < bezierPoint.at(i).size() && index < bezierPoint.at(next).size()) {
            ofVertex(bezierPoint.at(i).at(index));
            ofVertex(bezierPoint.at(next).at(index));
            index++;
        }
        ofEndShape();
    }
    
    for (ofVec2f p : points) {
        ofFill();
        ofSetColor(255, 255, 0);
        ofDrawCircle(p, 8);
    }
    ofPopMatrix();
}


void Shape::setPolygon(int n)
{
    size = 200;
    float angle = 360 / n;
    
    ofVec2f org = ofVec2f(0, -1);
    org = org * size;
    
    for (int i = 0; i < n; i++) {
        ofVec2f d = org;
        points.push_back(d.rotate(angle * i));
    }
}

Link to the reference page

ソースコードで使用したAPIの中から要点になりそうなものをいくつか選んでリストアップしました。

categoryAPI/Lib
openframeworksofVec2f
openframeworksofVertex
openframeworksofBezierVertex
openframeworksofBezierPoint

Development environment

  • openframeworks 0.10.1
  • c++
  • macOS
  • Xcode