JavaScript
滑らかな曲線を描く発生器が欲しくなったので再び考える 最終的な目的は、始点が(0,0)で終点が(1,1)、中に2点で全部で4つ。 高速に動作する。もちろんある程度短いことにこしたことはない。 で基本から。 <meta charset="utf-8"> <title>B-spline</title> <body> <canvas width="500" height="500"></canvas> <script> function B_Spline_Generator (point)</body></meta>…
canvas の部分は、外側にしろとあれほど・・・ <meta charset="utf-8"> <title>n木分</title> <body> <canvas width="1000" height="300"></canvas> <script> (function () { // NTreeは Nodeというオブジェクトを木の枝のように、親と子（配列）お持つ function Node (parent) { this.parent = parent; this.child = new Array (); } //_________ // 元とい</body></meta>…
なんとなくだが過去に教えていただいたものが蘇る 最近は、このUIは嫌われたか忘れ去られたか。 (function () { function filter (n) { switch (n.tagName) { case 'INPUT' : if ('hidden' === n.type) break; case 'TEXTAREA' : case 'SELECT' : if (n.disa…
/* 与えられた文字列の出現回数をそれぞれカウントする 使い方 var hoge = MultiCounter.create (['a', 'b', 'c']); hoge.countup('a'); hoge.countup('a'); hoge.countup('b'); var rst = hoge.getCount (); => [2, 1, 0] */ (function () { function Multi…
/* マウスのドラッグ操作で、3次元の物体の回転を制御する */ (function () { var INIT_QUATERNION = [1, 0, 0, 0]; function RotationController (element) { this.target = element; this.mouseX = null;//マウス座標の基点 this.mouseY = null;//マウス座…
それにしても、やっちまったなぁ〜 JavaScriptで選択問題作成(3) http://okwave.jp/qa/q9174815.html <meta charset="utf-8"> <style> fieldset.q ul { list-style: none; } </style> <body> <h1>問題</h1> <fieldset class="q"> <legend>Q1. 九州の県は次のうちどれですか?</legend> <ul> <li><label></label></li></ul></fieldset></body></meta>
http://okwave.jp/qa/q9172829.html正規表現は関数の外に展開したほうがよかったな。 そもそも取り出すテキストの中に同じキーワードがあるならば破たんするか。 製作時間６０分を目標としていたのに、超えてしまった。 5日間も休んでいた筋トレを再開した。…
球体をマウスドラッグにより回転させる。しかも慣性によりマウスアウトしたあとも少し回る。 3D canvas { background : #000; } //http://jsdo.it/totetero/without_polygon //http://stardustcrown.com/reading/rotate3d.html //http://d.hatena.ne.jp/gyuq…
クォータニオンによる回転を学び、正しく動作するように改良した。 要点は、前回のクォータニオンとマウスをドラッグした時のクォータニオンの積が 現在の回転クォータニオン数で、マウスアウトしたときは、 その積を前回の回転クォータニオン数として記憶す…
地球のテクスチャーマッピング。 基本的なところを勉強中。 マウスで操作できるのだが、イベントハンドラあたりを書き直した。 こちらは問題ないのだが、その５に適用すると球体の反対側を表にしたとき動作が逆になる。 あぁ〜時間がほしい。また忙しくなる…
マウスのドラッグにより球体の回転を行えるように改良した。 しかし、動作がおかしい <meta charset="UTF-8"> <title>3D</title> <style> canvas { background : #000; } </style> <body> <canvas width="1024" height="700"></canvas> <script> (function () { function CanvasController (canvas) { this.canvas = canvas; this.mouseX = 0; this…</body></meta>
面の明るさを計算できるようにした。 面の法線ベクトルを調べ、平行光源とのベクトルの角度を抽出して明るさを調べる。 もう高速化には限度がありそうなので、オブジェクト指向っぽく書き直すかな。 （プログラムが読みづらい） <meta charset="UTF-8"> <title>3D</title> <style> canvas { background :</style></meta>…
動かしてみたら、球体と回転にミスがあることが判明。 OKWave にも投稿したし、これで安眠できる。めでたし、めでたし。 <meta charset="UTF-8"> <title>3D</title> <style> canvas { background : #fff; } </style> <body> <canvas width="1024" height="512"></canvas> <script> function ball (r, n, n1) { var rst = [], a = [], b = [], c = []; var pi = M…</body></meta>
ここまでやったなら、「俺流」といえるかもしれない。 <meta charset="UTF-8"> <title>3D</title> <style> canvas { background : #ddd; } </style> <body> <canvas width="1024" height="512"></canvas> <script> function prism (r, h, n, n1) { var i, j, k, x, y, yn, z; var rst = [], top = [], btm = [], b = [0], c = [r]; v…</body></meta>
草刈りで疲れているというのに、興味をそそられた。 睡眠時間がないじゃん！ しかも今日は筋トレの日。 ベンチプレスが５０キロで停滞中。 CANVASで網目模様を描く方法を教えて下さいhttp://okwave.jp/qa/q9151762.html <meta charset="UTF-8"> <title>3D</title> <style> canvas { background : #ddd; } </style></meta>…
http://okwave.jp/qa/q9131681.html idx=1 だよな <html> <meta charset="utf-8"> <title>q9131681.html</title> <body> <dl id="hoge"> <dd>222</dd> <dd>333</dd> <dd>AAA</dd> <dd>AAB</dd> <dd>BBB</dd> <dd>BBC</dd> <dd>CCC</dd> <dd>CCD</dd> </dl> <script> function firstCharType (e) { var t = e.t…</body></meta></html>
ちょっとずつ改良(?)する オブジェクトの定義のやりかたがスマートなのか？！ <meta charset="utf-8"> <title>Snow</title> <style> body { background-color:black; overflow: hidden; } </style> <body> <script> var Snow = new function () { if ( 'undefined' === typeof addEventListener || 'undefined' === typeof setI</body></meta>…
雪を降らせるスクリプトを過去のHDDから拾ってきた。 こういうスクリプトを見たとき感動したことを思い出す。 じっくりと眺めている。 基本というかこのテーマが「オブジェクトを移譲しまくる！」なのだが、 未だにこんな書き方の発想を１から作ることができ…
(function () { //select要素のoptionを書き換える function replaceSelectOption (select, text, value, defValue) { //引数確認 if (2 > arguments.length) throw new Error; if (! /^(SELECT|DATALIST)$/.test (select.tagName)) throw new Error; if (! …
MySQLの結果を転置したくて考えてました。一時間悩んだコード。 関数CのArray#concatがいけてない。 function C (a, b, c) { a[c] = (a[c] || []).concat (b); return a; } function B (a, b, c) { return b.reduce (C, a); } function A (ary) { return ary…
HightCharts http://www.highcharts.com/demo/3d-column-interactive ライブラリーを書いた人が凄すぎる。 でもね、３次元でソートして奥から描いてくれたら最高！ border と 透明度を設定できたら更に最高！ 次は、Ajaxを使ってPHPを呼び出し、そこからMySQ…
フォームの要素の値が変化するたびに呼び出され、ローカルストレージに保存する webアプリの環境設定に利用するために書いてみた。 いつも少し書いては、試しながらコーディングする。 今回は、すべて頭の中で動かしながら書いてみた。 単純なミスが１つ、構…
チェック出来る数を制限&チェックされない場合0http://oshiete.goo.ne.jp/qa/8600163.html なんでだろう？腹が立った！あっちが立たない腹いせか？！ キャラを変えた、今日だけ？ :null が邪魔だ〜！ <meta charset="utf-8"> <title></title> <style> </style> <body> <form id="piyo" action="#"> <p> <label><input type="checkbox" name="ch1" value="1">1</label> <p> </p></p></form></body></meta>
やっぱり勉強しないと理解できない。 // Ajax のライブラリ (function () { function uriEncode (parm) { var result = [ ]; var pm, dv, prop; var i, I; if (parm == null || parm == '') return ''; switch (typeof parm) { case 'string' : if (0 === pa…
最も多くチェックされた項目を調べるhttp://oshiete.goo.ne.jp/qa/8587233.html 最近の回答は、もう代入文だけで、結果がでてる。 「もうこんなのは、プログラムと呼べない！」 と、叫んでみたい！^^; かといって、あそこでは複雑な質問・もしくは面倒な（傾…
多次元配列の位置取得http://oshiete.goo.ne.jp/qa/8581039.html あ〜締め切られたのね  <title></title> <meta charset="utf-8"> <body> <script> var test = [ {"name":"yamada","age":30,"weight":62,"blood":"a"}, {"name":"tanaka","age":28,"weight":58,"blood":"b"}, {"name":"kamimura","age":46</body></meta>…
クッキーでオブジェクトを考えてみる <html lang="ja"> <meta charset="utf8"> <body> <h1>theCookie</h1> <p> <a href="htp://www.test.jp">TEST</a> <script> /* Object.defineProperty (obj, prop, descriptor); descriptor = { configurable : false, // true->プロパティを変更・削除が可能 enumerable : false, // true->プロパティに列挙される…</p></body></meta></html>
外部HTMLの特定のクラス名の文のみとりだしたいhttp://oshiete.goo.ne.jp/qa/8548024.html bind で囲った時点で、OKなのか？暇なときに調べる、だれかが。 removeEventListener でイベントを取り除くとき、 Function.bind () のように同じにしなきゃないとか…
理論は未だ不明なのだが、ryamada22 さんからの助言を頂いた方法で試してみた。 こちらの方が均等な感じがする もちろんコードはやっつけで書いたので、後で清書する。 <meta charset="UTF-8"> <title>test</title> <style> body, canvas { background : black; } </style> <body> <h1>Test </h1> <canvas width="1024" height="1024"></canvas> <script> var canvas = document.quer…</body></meta>
N個の数を数えてみたら、N個ではなかった。それを修正する。 黄金比を半分にし、点の間隔を２倍にした。 地球でいえば、南極点が出ないようにループの条件を変える。 将来的に速度を要求するので、それを優先して球体の点を生成するコードを書き直した。(結…
