見出し画像

Babylonjs勉強会 LT会に登壇した話

こんばんは、かーでぃです。
今日は、イベント「登壇」側なので、自分のところだけ。全体記事はきっとLimesさんが日本語版と英語版を書かれると思うので(笑)

はじめに

今回のテーマは、色々と悩みました。
もともとは、昨年4月のLTで話をしたデジタルツインの関係で、温度以外のデータも見れるようにしたよー!
というところにしようかと思ったのですが、ラズパイ弄るのが面倒せっかくならオープンデータを活用しよう!ということで、こちらのテーマになりました。

アーカイブ動画

登壇資料

決して、コードを書くのが面倒だったわけじゃないです。
オープンデータを活用してみたかった、というお話です。

天気情報のオープンデータ

ということで、まずはオープンデータ探し。できれば、APIでデータ取得できるところがいいな…と思い、天気データを探してみたところ、こんなサイトを発見しました。

https://open-meteo.com/

ここの良いところは…

  • 全世界の天気データをAPIで取得できる

  • 個人利用ならAPIは無料(表記だけでOK)

  • APIキー不要(認証とかメンドイ)

  • API Builderで楽々成形

こちらのブログを参考にさせて頂きました(感謝!!!)

そこからデータを取得してきまして、ぷちデジタルツインの際に使ったグラブ描画の関数を再利用して、出来上がった降水確率のグラフがこちらです。

https://playground.babylonjs.com/#H8WVG0#7

コードはPlaygroundに上げてありますので、そちらを参考にしてもらえればと思います。
登壇の中でもしゃべりましたが、Babylon歴は2年ぐらいになりますが、全然上っ面しかわかってないので、参考になるものも無いかもしれませんが…

Babylon.jsのテクニック?!

ここまでLT時間で言えば、恐らく6分~7分ぐらい(毎回、ストップウォッチで時間を計ろう!と思い、スマホを目の前に立てておくのですが、登壇を始めるときにスタートボタンを押し忘れ、結局登壇時間がわからない…のを、いい加減治したい。。。)のハズ。

そして、ここまででBabylonの話がほとんどされてない事実(笑

このまま終わってもいいのですが、あまりにも寂しいので、ちょっと無理やりBabylonの話をねじ込んでみましたw

これまで、Babylon.js使って何本かコードは書いてきましたが、メッシュを作るだけ作っても、消したことなかったです!
どうやって消すんだ?と思って、ChatGPTに聞いたら、👆のようにして消すんだよ、と教えてくれました(ChatGPT先生、ありがとう)。

実際にBoxを消すコードです。
棒グラフを再描画する前に、これを実行して消すようにしています。

function claerGraph() {
    for(i=0; i<12; i++){
        const myMesh = scene.getMeshByName("grp"&i);
        if (myMesh) {
            myMesh.dispose();
        } else {
            //console.log("メッシュが見つかりませんでした。");
        }
        const myPlae = scene.getMeshByName("smallPlane"&i);
        if (myPlae) {
            myPlae.dispose();
        } else {
           //console.log("planeメッシュが見つかりませんでした。");
        }
    }
}

CreateBox等でメッシュに名前を付けれるのですが、これまで雑に"box"とかにして、ぜーーーーんぶ同じ"box"って名前にしてたけど、これからはちゃんとユニークな名前を付けてあげるようにしますー。

名前って大事ですね(笑

課題というか発展させたいこと

  • 緯度経度を指定することで、地図画像を参照できるAPIと組み合わせて、世界版にしてみたい(Bing Map APIなど)

  • Re:Earthのウィジェットとして取り込んでも面白そう。

今回は豊橋市固定です(豊橋在住なので)。
ただ、書いたように地図画像連携ができると面白そうです。今回、そこまで含めたデモをしたかったのですが、Bing Map APIの使い方がわからず断念しちゃいました。

5月の技術書典ネタは、この辺りからかなーと、ぼんやり思ってます。
※Re:Earthプラグインは、マニアックで面白そう

最後はXのポストのご紹介

イベント運営の皆様、登壇の機会を頂きましてありがとうございました。
自分を除く登壇者の皆様、素敵な登壇をありがとうございました。
参加者の皆さん、目一杯の拍手や応援メッセージをありがとうございました!


この記事が気に入ったらサポートをしてみませんか?