See the Pen ぶつからないように動くビークル by kanaparty (@kanaparty) on CodePen. あとでイテレータについて書く
See the Pen 流れに沿おうとするビークル(曲がり角では曲がる) by kana (@kanaparty) on CodePen. 前回 tuitui.hatenablog.com との違いは 曲がり角の数だけ法線を求める記述が増える 進行方向上の予測ポイントと道の法線の接点(距離を測るときに使う)が道の…
形の美とは何か (NHKブックス)作者: 三井秀樹出版社/メーカー: 日本放送出版協会発売日: 2000/03メディア: 単行本購入: 5人 クリック: 11回この商品を含むブログ (8件) を見る 読み途中だけどメモ 形 抽象(理念的なかたち) 定形(再現できる・数式で表せる形…
See the Pen 流れに沿おうとするビークル by kana (@kanaparty) on CodePen. ビークル(流れている点)は毎フレームごとに、今進んでいる進路上の点が道幅からでてしまうようであれば、 その進路上の点から道の真ん中と垂直に交わる点のちょっと先を目標に動…
職場で使っているエディターをsublimetextからatomに乗り換えたんですけれど プロキシ設定しないとパッケージのインストールができない。 apm config set https-proxy http://username:password@proxy-server.example.com:000000 apmはAtomのコマンド プロキ…
tuitui.hatenablog.comのときのメモ 2つのベクトルから角度を求めるとき A⃗ · B⃗ = ∥∥A⃗ ∥∥ * ∥∥B⃗ ∥∥ * cos(θ) と A⃗ · B⃗ = axbx+ayby から θ = cos−1 ( ( A⃗ · B⃗ ) / ( ∥∥A⃗ ∥∥ * ∥∥B⃗ ∥∥ ) ) なので、ベクトルでよく使う関数をいつも使いまわしている…
See the Pen 風の吹く流れ場 by kana (@kanaparty) on CodePen. またパーリンノイズに頼ってしまった
See the Pen 流れ場 by kana (@kanaparty) on CodePen. canvas30pxごとにパーリンノイズでつくった方向の情報を持たせ、 ビークルが上を通るたびにその情報を渡して加速させる。 パーリンノイズ便利すぎる ついついなんでもパーリンパーリンしてしまうので気…
See the Pen マウスを追いかけてくるビークル by kana (@kanaparty) on CodePen. いつも配列やオブジェクトは参照だってことを忘れてしまう
開始タグと終了タグを省略できる要素がある html head body tbody colgroupのこと。(状況によっては・・と必ず但し書きが付いている) 詳しく和訳されている・・・! HTML5 で省略できるタグ - Qiita <の後、>の前には空白は入れてはいけない doctype宣言は…
pages.github.com (やり方は公式ページが分かり易すぎるので特に書くことはないです・・) リポジトリごとでも作れるし、アカウントでも作れる。 静的なページは、作業して、gh-pagesブランチにプッシュしたら簡単に作れる!便利だ〜 ※ブログなど動的なサイ…
前回 tuitui.hatenablog.com 四角じゃないものを作ってみます。 See the Pen Box2DWebを使ってみる(3) by kana (@kanaparty) on CodePen. 頂点が何個かある物体をつくる 前回はPolygonShapeのSetAsBoxメソッドを使って四角をつくりました。 四角以外のものは…
bodyを作ったので、アニメーションのためのループしながら、ワールドから座標を取得してcanvasに書いてみます。 前回 tuitui.hatenablog.com 作ったもの See the Pen box2dを使ってみる(2) by kana (@kanaparty) on CodePen. 作成したbodyのbox2dワールドで…
ES6のクラス構文を使ってみたのでまとめてみます。 対応状況 はここで確認 ECMAScript 6 compatibility table クラスの定義 class Particle { //初期化 constructor() { this.fillColor = 'rgba(54,59,123,0.8)'; ・・・ } //メソッド appllyForce(forceVect…
フリーのWebデバッグツールFiddler Fiddler free web debugging proxy を使う機会があったのでメモ。 httpsの設定 httpsで使うときは設定が必要なので忘れないようにメモ。 「Tools」-「Fiddler Options…」から「HTTPS」タブを選択。 「Capture HTTPS CONNEC…
物理エンジンbox2dのjs版はいろいろあるみたいだけれどbox2dwebを使ってみます。 hecht-software/box2dweb · GitHub flash用のものをjsに置き換えたものだそうで、基本的な使い方はbox2dと同じみたいです。ドキュメントはこれを見ています。 Adobe Flex 2 La…