JavaScriptとcanvasに関するroombaのブックマーク (3)

  • ヒマワリと黄金比の関係をインタラクティブなアニメーションにする【Javascript】【Canvas】 - roombaの日記

    はじめに 先日、『数学で生命の謎を解く』というを読みました。このの第4章「花の中にみつかるフィボナッチ」には、植物の葉・ヒマワリの種子・パイナップルの模様がフィボナッチ数列*1と深く関わっていることが説明されています。 「花の中のフィボナッチ」は数学と生命科学の関係を述べた文章に必ずと言っていいほど登場する鉄板ネタなのですが、書には以下のような興味深いモデル(フォーゲルのモデル)が紹介されていました。 1979年にミュンヘン工業大学のヘルムート・フォーゲルが、ヒマワリの種子が取る幾何の単純な数学的表現を考え、それを使って、そのような配置に黄金角が特別適している理由を説明した。*2 フォーゲルのモデルでは、n番目の原基は137.5度のn倍の角度に置かれ、中心からの距離はnの平方根に比例する。これらの二つの数によって原基の位置が決定し、ホフマイスターの生長らせんは、中心から外側へ行くにつ

    ヒマワリと黄金比の関係をインタラクティブなアニメーションにする【Javascript】【Canvas】 - roombaの日記
  • テオ・ヤンセン機構をHTML5 Canvasでアニメーションに - roombaの日記

    はじめに オランダのアーティストであるTheo Jansen(テオ・ヤンセン)氏は、風力によって歩行する巨大な脚「ストランドビースト」をつくったことで有名です。「ストランドビースト」には特殊なリンク機構(Jansen's Linkage)が用いられており、これによって風力による回転運動を生物のように生き生きとした脚の動きに変換しています。 Theo Jansen Japan Jansen's linkage - Wikipedia, the free encyclopedia 以下のような組み立てキットも発売されています。私も持っていますが楽しいです。 大人の科学マガジン Vol.30 (テオ・ヤンセンのミニビースト) (Gakken Mook) 作者: 大人の科学マガジン編集部出版社/メーカー: 学習研究社発売日: 2011/01/14メディア: ムック購入: 13人 クリック: 267

    テオ・ヤンセン機構をHTML5 Canvasでアニメーションに - roombaの日記
    roomba
    roomba 2015/02/25
    アニメーションの手法自体はリンク機構一般に使えますが、テオヤンセン機構だと計算が若干ややこしいです
  • HTML5 Canvasで動くジェネラティブ・アートをブログに貼る - roombaの日記

    「ジェネラティブ・アート」 最近『ジェネラティブ・アート』というを買いました。ジェネラティブ・アート(Generative Art)とは、通常のアート作品のように人間が描いたりつくったりするのではなく、何らかのアルゴリズムやランダム性を利用して生成的につくられるものを言います。ちょっとしたプログラムでアートができるので、絵心が不要なのが魅力です。 下のように画像検索すると、かっこいいものがいくつもでてきます。 generative art - Google 検索 HTML5 Canvasで描いた絵をブログに貼り付ける方法 を読んだら実際に製作してこのブログに貼り付けたいので、お絵描き方法としてはHTML5 Canvas + Javascriptを使うことにし、貼り付け方を調べてみました。ではProcessingという言語を使っているのですが、Javascriptの方が好みなので。 試

    HTML5 Canvasで動くジェネラティブ・アートをブログに貼る - roombaの日記
    roomba
    roomba 2015/02/18
    コンピュータに絵を描かせる方法と、その動く絵をブログ等に貼り付ける方法
  • 1