クオータニオンを使ってマウスで回転 // target.addEventListener (n, this, false)); } //_________________________________________________________________ //各イベント処理 handleEvent (event) { let { type, pageX, pageY, target: e } = event; sw…
クオータニオンのメモ class Quaternion { constructor (w = 0, x = 0, y = 0, z = 0) { this.w = w; this.x = x; this.y = y; this.z = z; } add ({w, x, y, z}) { this.w += w; this.x += x; this.y += y; this.z += z; return this; } mult ({w, x, y, z}…
文字の色を虹色に変化させるスクリプトを書いてみた。またくだらないものを書いてしまった。 function getColor (n) { const M = 255; let c = n % 360 / 60 | 0; let x = n % 60 / 60 * M |0; let y = M - x; let [r,g,b]=[[M,0,y],[M,x,0],[y,M,0],[0,M,x]…
JavaScript 行列演算 let a =[[1,2], [3,4]]; let b =[[5,6], [7,8]]; let r =[[19,22] [43,50]]; //行列の加算 function add (a, i) { let b = this[i]; return a.map ((a, j) => a + b[j]); } //行列の減算 function sub (a, i) { let b = this[i]; return…
JavaScript: サーバーの時間を取得する 問題があるとすれば、 同期で行っていること リクエスト返ってくるまでの時間差を加味したこと //サーバーの時間を取得する function getUTCDateByServer () { let xhr = new XMLHttpRequest(), tm0, tm1, tm2; xhr.op…
JavaScript: innerHTML したときに中に含まれる script が実行されない件 function setInnerHTML (node, text) { node.innerHTML = text; let script = node.querySelectorAll ('script'); if (script.length) { let doc = node.ownerDocument, org = doc.cr…
ベジェ曲線を理解する その前に線分を式にする。端点(p0, p1)とする。 この式は実際の線分の長さはどうであれ t が0から1の範囲で線分上の任意の点を表せるようにするという意味である。 これをJavaScript で関数にすると以下のようになる。t の変化は 0.0…
JavaScript: Promise を理解する 順不同の工程を順序立てて行わせるときにい使うもの let obj = new Promise (func); -- 関数 func には実行したい処理を書くのだが、2つの処理用の関数を引数として受け取らなければならない。1つは、成功したあとに行う関…
SVG で描画してみる // `${x},${y}`).join (' ')); svg.appendChild (poly); } // ]]> <code> <svg width="800" height="800" xmlns="http://www.w3.org/2000/svg" id="hoge"> </svg> </code> <script> const doc = document, svg = document.querySelector ('#hoge'), { PI, sin, cos } = Math, cx = 400, cy = 400, polyline = d…
<title>?</title> <meta charset="utf-8"> <style> li label { color: green; font-weight: bold; padding-right: 1ex;} </style> <body> <div> <label>KeyWord:</label> <input type="search" autofocus> <em>space で区切ることも可能</em> <ul id="list"></ul> </div> <script> { //____________________________…</body></meta>
Javascript イベントを遅らせて発火させる class DelayWork { constructor (callBackFunc, wait = 500) { this.callBackFunc = callBackFunc; // func.bind (this) this.wait = wait; this.timerID = null; } start (...arg) { if (! this.timerID) { let cb…
時間間隔をちょっと考えて class DateInterval { constructor (begin, end) { this.begin = begin; this.end = end; } isInRange (date = new Date) { let b = +this.begin, e = +this.end, d = +date; return b <= d ? d <= e: false; } copy () { return n…
まだ移譲が不足なのだろうか? <title>?</title> <meta charset="utf-8"> <style> label { color: green; margin: 1ex 1ex 1ex; font-weight: bold;} </style> <body> <div> <label>KeyWord:</label> <input type="search" id="keyword" autofocus> <em>space で区切ることも可能</em> <ul id="list"></ul> </div> <script> { clas…</body></meta>
それにしても色々な質問があるものだ。 すべてには答えきれないね。 そこでふと考えた。 解説などしないで、男ならコードだけで勝負しようと思った。 解説などいっさしない! それに無視することも私の自由だ。 これからは、そうしよう。 タグ別ランキング1…
https://oshiete.goo.ne.jp/qa/10921080.html 使われた言葉に点数を加算していくのだが、最大値を超えないようにするには? そんで、考えた。 あっ!光の速度はこえられない! 相対論的な速度の加算方式を利用しよっと。 <meta charset="UTF-8"> <html lang="ja"> <title>?</title> <style> </style> <body> <h1>Test</h1> <input type="search" value="リンゴ" onblur="dic(this.value)"><br> …</body></html></meta>
まともに記事を書き上げたことがないが、ちょいちょい写真もアップしながら書こうと思う 2018年、4台のマシンを購入する トラブルの解決法をまとめておく ネジは必ず締めましする 4台購入したが、どれもどこかしら緩んでいた。なので手当たり次第ネジを締め…
ちょい書きかけ う〜〜〜ん。明治とか大正の時代の休日も今どきとして必要なのか? 今さらながら、作ってから気づく。 <html> <head> <meta charset="UTF-8"> <style> </style> </head> <body> <h3>六曜について</h3> <pre> n = (month + day) % 6; ary = ['大安', '赤口', '先勝', '友引', '先負', '仏滅']; rst = ary[n]; </pre> <script> { const CUR</body></html>…
久しくプログラミングから離れている。 勉強しようと思ったら MDNの https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Indexed_collections#Working_with_array-like_objects に 「配列様のオブジェクトを利用する」とある! 配列はとくに別格で…
https://qiita.com/MoriKen/items/1fff4f7ed8eae88a9983
数独の正解確認のプログラムを作りたいhttps://okwave.jp/qa/q9544201.html やっぱり頭のネジが緩んでるな。間違いだらけだった。 let A = [ 7,6,1, 3,5,2, 8,4,9, 5,8,2, 9,4,1, 3,7,6, 4,9,3, 7,6,8, 2,1,5, 6,2,8, 4,7,3, 9,5,1, 9,7,4, 1,2,5, 6,3,8, 3,…
PLA 0.2mm積層 ファジースキン処理 40時間超ても印刷が終了しない。何時おわるんだよ〜! 三宝を作ってみた。 PLA 0.2mm積層 これもファジースキン処理。 緑色で透明なフィラメントを使用する。 ラメが入ったような光沢をだす。 制作:2分割、総制作時間:約…
URLによってHTMLのテキストを変更するコードを教えてください。https://oshiete.goo.ne.jp/qa/10703653.html あれ!? element.lang を使うべきだったよな コードの意味(どのようなイベント発生など)を調べてhttps://okwave.jp/qa/q9534243.html かなり省略…
東北の田舎じゃ葬式に葬列組んでお墓に行くんだよね。その時に使う龍頭を作った。 なかなかの出来栄え!(自画自賛) 角が一本なのは壊れにくくするため、モデルとなったのは、ドラゴンボールにでてくるシェンロン! でもちょっと小さい! 長谷川さんに売り…
フォームで開始時間と終了時間の二つのselectボックスを表示させたい 久々の回答。レスが付かないとおもってたけど https://oshiete.goo.ne.jp/qa/10669901.html 3Dプリンタで見台(スマホ台)を作った。しかもシャー専用の赤、滑り止めが3倍ついて滑りにく…
造形は楽しいが、印刷に時間がかかりすぎる。 眺めて見ては、色々な問題点やら改良案、造形へのデザイン変更やら・・・ アイディアが尽きる事はない。 それはそれで楽しい。 AMAZONから購入したのだが、すでにプリンタを買った金額の3倍以上の金額をアレコ…
<html lang="ja"> <meta charset="UTF-8"> <body> <h1>textarea 要素の オートインデントを行う</h1> <p><input id="A"></p> <textarea id="B" cols="60" rows="10"></textarea> <script> //_____autoIndent { const NOT_LF = /\r\n|\r/g, REG_INDENT_SPACE = /^([\s\u3000]+)/, //インデント分の空白を挿入 addEnter = function (e) …</body></meta></html>
Event(input) を利用して、文字の連続入力が終了したら、一定時間後に change イベントを発火させます <html lang="ja"> <meta charset="UTF-8"> <body> <h1>Input 要素の change イベントを遅延させて発火させる</h1> <p><input id="A"></p> <script> { // input イベントを監視して、変更があったら change イベントを発火させる class delayC</body></meta></html>…
右端のクリックは良いのだけれど、左端では微妙に戻れない。研究の余地あり。 というか、スクロールの指定ぐらい実装しろよ! > amazon !! ページ内のリンクもOK!! TreeWalker オブジェクトも使えるので、そちらに切り替えようか? それにしてもこの中途半端…
反応が悪いが click イベントで画面の両端を触れたことを認知するっことはできた。 しかしページ内でのリンクが機能しない! eindow.moveTo は、効かない。今の所スクロールする手立てがない。 唯一方法としては、クリックイベントをハックして、そのキーが…
まずは Javascript を中心に調べる alert は使えるが、 console.log は使えない var は使えるが let が使えない touchイベントが使えない click なら反応する HTMLで気になっていること p タグに white-space: pre ; が効いているのか、テキストの改行がその…