タグ

canvasに関するtorimokuのブックマーク (5)

  • オンズ

    【jQuery】Geometryangle のサンプル・デモ 斬新なポリゴン・スタイルの背景を描画する jQuery プラグイン[Geometryangle]のサンプルです。 HTML5から導入された新要素『canvas』を使って描画しているので、IEなどの古いブラウザやスマートフォンでは何も表示されません。 最新のモダンブラウザを利用してご覧ください。 マウスカーソルの位置に反応してインタラクティブに動きます。 サンプルがうまく動かないときはページを再読み込みしてみてください。 また、エラーや間違い等を発見された方はぜひお知らせください。 オンズでは各スクリプトの実装のお手伝いも承っております。 比較的安価で最新・高機能なシステムを導入できますので、ご希望の方はお気軽にお問い合わせください。 お問い合わせはオンズのお問い合わせフォームからどうぞ。 記事に戻る © ONZE.

    torimoku
    torimoku 2016/08/03
    サイバー ライン ポリゴン アニメーション 背景とか
  • Particleground demo

    Particleground A JavaScript plugin for snazzy background particle systems Download

    torimoku
    torimoku 2016/08/03
    サイバー ライン ポリゴン アニメーション 背景とか
  • Particles.js

    torimoku
    torimoku 2016/08/03
    サイバー ライン ポリゴン アニメーション 背景とか
  • Andrew Wang-Hoyer

    SVG + CSS Animations During my funemployment between Inkling and Dropbox I started playing around with animating SVGs. This lead to building out over 200 animations off and on over 2 years. SVG CSS 11ty Open Source Feb 2020 Restyling The Game of Buttholes At the beginning of May 2019 I was looking at gagh.biz/game and thought it could use a little more Star Trek flare. CSS Django Open Source May 2

    torimoku
    torimoku 2014/08/18
    CSSで時計とか、不思議な動きとか、いろいろな実験的作品を作っているようです
  • ↑矢印をプログラムで描く;単純ベクトル加算法 - 万象酔歩

    矢印・矢尻の数学、直交するベクトルの加算 矢印の矢尻図形は基となる線ベクトルに対し左右90°方向のベクトル と逆方向のベクトルを加えることにより得ることができます。 矢尻生成には三角関数も向きによる場合分けも不要です。 簡単なことなのですが、2点"(Ax,Ay)-(Bx,By)"間に矢印を書きたい場合 の計算式が瞬時で出るかというとそうでもないので、ここにメモして おきます。実際に動く計算プログラム・ソースも載せます。 矢尻端2点を得る基計算 点A(Ax,Ay)から点B(Bx,By)に矢印線を引きたいとします。 矢尻の幅を2w、長さをhとします。 この条件で矢尻の左端L(Lx,Ly)と右端R(Rx,Ry)を算出します。 左方向、右方向、逆方向の単位ベクトルを得ます。 基ベクトル : Vx = Bx - Ax Vy = By - Ay 基ベクトル長 : v = sqrt(Vx×Vx

    ↑矢印をプログラムで描く;単純ベクトル加算法 - 万象酔歩
    torimoku
    torimoku 2011/07/26
    矢印の書き方
  • 1