タイトルの通りです。micro:bitとGoogle ChromeをWeb Bluetooth APIで繋ぎました。 Google Chromeからmicro:bitのLEDマトリクスを制御します。まず、micro:bitの説明は端折りますが、簡単に説明すればマイコンです。 英国では11〜12歳の子供、全員に無償で配…
Atom Matrixを購入したので、Arduino IDEからコードを書き込んできました。ATOM Matrixwww.switch-science.com 完成したもの 本体を傾けると下方向を指す矢印を表示します。 ここに至るまでにやったことを順を追って説明していきます。 Atom Matrixの仕様を…
Three.jsに3Dモデルを読み込んだとき、時々、環境光源(AmbientLight)が当たらないモデル(平行光源・DirectionalLightや点光源・PointLightなど他のライトは当たる)がありまして、しょうがないので他のライトで照らしていたのですが、やっぱり気になるの…
ウェブアプリの開発中に、#ffffff → 255,255,255 みたいな変換が必要になりました。 こんな処理は絶対に誰かが書いているはずだ。と思い調べてみたところ、www.npmjs.comばっちり見つかりました。ソースコードも37行とかなり短く、これを使おうかなとも思っ…
ポインタを渡せば関数の引数に配列を渡すことができます。 void setup() { Serial.begin(9600); } void loop() { int arr[] = { 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 }; checkArr(arr); delay(1000); } void checkArr(int *arr) { Serial.println(arr[9]); // → 9 …
起動した際に、・expressでサーバを立てる(ポートは3000) ・publicディレクトリの中身をホスティングする ・socket.ioでサーバとクライアントの通信を行う(ipc通信の代替) ・Google Chromeを起動しhttp://localhost:3000を開く(Chromeのダウンロードは…
developer.mozilla.org developer.mozilla.org以前からAndroidのChromeには搭載されていたものの、iOSのSafariには搭載されてなかったWeb Share APIですが、iOS15にてついに有効になったとのことなので、早速実装してみました。一番ハマったところは、naviga…
passiveをfalseにしてtouchmoveのEvent.preventDefaultを実行すれば、Pull to Refresh(引っ張って更新)を止めることができます。 documents.addEventListener('touchmove', function(evt) { evt.preventDefault(); }, { passive: false }); 今回は、touchm…
今朝、iOSを15にアップグレードしつつ、Mac版のSafariも最新にしてみたところ、どちらもサイトによってメニューバーやナビゲーションバーの色が変わるようになってました。Safari15から、theme-colorを評価するようになったようです。developer.mozilla.org…
通常、positionをfixedにした要素の親要素のoverflowをhiddenにしても、はみ出した部分は隠れません。 HTML <div class="parent"> <div class="child"></div> </div> CSS .parent { position: fixed; top: 0; bottom: 0; left: 0; right: 0; margin: auto; width: 160px; height: 160px; background: red; overfl…
developer.mozilla.orgMDN Web Docsにてwindow.closeの仕様を確認してみると、 Window.close() メソッドは、現在のウィンドウ、またはそのページ上で呼び出されたウィンドウを閉じます。このメソッドが許可されるのは、window.open() メソッドを用いたスクリ…
基本的には、React.cloneElementを使い、propsを固定した状態のcomponentを作るのがセオリーのようです。ja.reactjs.orgイメージ的には、Function.prototype.bindを使って引数を固定した関数を作るのに似ている気がしました。developer.mozilla.org実際に例…
functionで宣言した関数の中でthisを使うと、 'this' implicitly has type 'any' because it does not have a type annotation. とエラーが出ます。アローファンクションと近い、functionによる関数宣言は実行方法によってthisが変化するからです。TypeScrip…
Node.jsで普通にimportを使おうとすると、 SyntaxError: Cannot use import statement outside a module と怒られます。いままではおとなしくrequireを使ってきましたが、世間はもう2021年。子供の頃思い描いていた未来です。 そう。流石にimportを使いたい…
4年ぐらいぶりにシリアル通信を行うElectronアプリを作りました。おぼろげながら、 electronとserialportを普通に組み合わせるとエラーが出る rebuildすると使える という4年前の記憶がありまして、まずは、electron + serialportで中身が空っぽのアプリを作…