Javascript
同じオブジェクト内のプロパティを変数として使いたかった。 var obj = { x : 100, y : x + 100//Uncaught ReferenceError: x is not defined } console.log(obj.y); これではエラーが出てしまった。代替案を考えよう。参考にしたのはこれ。 javascript - Re…
JSConf こちらはyoutubeのチャンネル。JSのカンファレンスのプレゼン映像がまとまっている。 JSConf - YouTube Chrome Extensionの投稿者リスト これはTwitterのリスト。Chrome Extensionのクリエイターがリスト化されている。このタイムラインにはJSでクリ…
チルダの意味とは チルダ「~」はビット反転演算子で、整数をビット反転させると反転させて1引いた数になる。これを説明する前に2進数における、補数や符号付き整数について説明する。以下はこれを参考にしている。 2の補数を理解する (1) - とあるソフトウェ…
switchを使う方法 var color = "red"; switch(color){ case "red": console.log("RED"); break; case "blue": console.log("BLUE"); break; case "yellow": console.log("YELLOW"); break; defalut: console.log("different color"); break; } この場合、「R…
demo 無名関数を英語にしたら「no name function」だと思っていたが、何だか気持ち悪かったので調べてみると「nameless function」だった。匿名関数(anonymous function)って呼び方もある。 404 Blog Not Found:jargon - 無名関数(nameless function)?匿名関…
for-inを使うのはいつが良いのか for文でも書ける場合、lengthを書いてると長ったらしくてオシャレにfor-in使いてえなあとふと思った。それで使い方を確認するために下の記事を読む。javascriptのfor-in文は、for-each文の代わりじゃない - うろ覚えメモfor-…
clickとmousedownの違い イベント名 内容 mousedown マウスダウンでイベント発生 mouseup マウスアップでイベント発生 click マウスダウンとマウスアップがあるとイベント発生 各イベントの違いがわからなかったので調べた。例えばゲームなどで、マウスダウ…
demo Creative JSの動画を見たのがきっかけ CreativeJS for Designers from Seb Lee-Delisle on Vimeo.パーティクルをとりあえず動かしてみることを解説している。基本的なところはこれを写経して、後はオリジナルで何かできないかやっていた。 マウスポイン…
ray detecting click event in THREE.js | ヨモツネット・マウスポインタを消す Pointer Lock and First Person Shooter Controls - HTML5 Rocks
r51→r52 Moved *Controls to examples/js/controls. Migration · mrdoob/three.js Wiki · GitHubPathControlのようなカメラの動きを使うメソッドはthree.jsとは別にライブラリを読み込む必要がある。
Cubeの各面に異なるマテリアルを使う 見事にハマったのでメモしておく。 //Cube var materials = []; for(var i = 0;i < 6;i++){ materials.push(new THREE.MeshBasicMaterial( { color: Math.random() * 0xffffff } ) ); } var CUBE_WIDTH = 200; var CUBE_…
demo ★inspire three.js webgl - geometry - vertex colors 正二十面体のジオメトリーを作成 var ICOSAHEDRON_RADIUS = 1;//正20面体の半径 var ICOSAHEDRON_DETAIL = 2;//分割回数 var color,f,f2,f3,p,n,vertexIndex, //正20面体のジオメトリー geometry =…
demo 三角関数による位置・大きさの調整 ・参考 https://threejsdoc.appspot.com/doc/three.js/examples/canvas_particles_waves.html https://threejsdoc.appspot.com/doc/three.js/examples/canvas_particles_floor.html particles = new Array(); まずパ…
demo ParticleはCloneできる Cloneはベクトルを複製することを指す。 .clone() Vector3 Clones this vector. THREE.jsのソースはこちら。 https://github.com/mrdoob/three.js/blob/master/src/objects/Particle.js THREE.Particle.prototype.clone = functi…
demo CanvasRendererとは何か? THREE.jsが持つ描画モードの一つ。WebGLを使わずにCanvasのコンテキスト2Dのものを使用して描画している。WebGLを使う描画モードはWebGLRendererである。ドキュメントの説明はこちら。 The Canvas renderer displays your beau…
demo 平行投影カメラ 平行投影カメラで撮影すると、遠近感がなくなり、近くのものも遠くのものも同じ大きさに見える。反対に遠近法を考慮する透視投影カメラ(PerspectiveCamera)もある。これを使ってカメラワークを回転させると、酔う感じが強い気がする。そ…
demo Meshの位置を変えて複数の立方体を作成する //ジオメトリーを生成 var geometry = new THREE.CubeGeometry(60,60,60); //マテリアル(ランバート反射)を生成 var material = new THREE.MeshPhongMaterial({color:0x660000}); //キューブの個数 var cubeN…
THREE.jsを使い始めた(再開し始めた?)理由 ズバリかっこいいから!TwitterでTHREE.js作成者のMr.doob氏やその周りのクリエイターがつくったものを見て、自分も作りたいと思った。それらがすべてWebGLを使ったものではないかもしれないけど、見て楽しめるもの…
6月にエントリーシートの下書き作成用エディタをつくった。 ES Draft http://naoyashiga.github.io/ES_Draft/ 行数カウンターを設置しているが、それの数え方がうまくいかない。行数をカウントして、テキストエリアのサイズを可変にするようにしていた。しか…
「リクナビからGoogle Calendar™に登録」を作ったときにGoogleカレンダーのボタンを設置した。それの作り方を書く。 Github https://github.com/naoyashiga/Google_Calendar_From_Rikunavi URLパラメーターの定義 パラメーター 内容 action TEMPLATEで固定 t…
6月に「リクナビからGoogle Calendar™に登録」というChrome拡張をつくった。 https://chrome.google.com/webstore/detail/bmphpfgkflpmkbeaolhhablmbnbbhcgn/publish-delayed 友だちに使ってもらったところ、起動していないときがあった。それの原因が、URL…