# RikenHackathon 2019
from 2020/2/20

## タスク洗い出し
- 加沢先生や池野先生からx3d,obj,stlのデータをもらう
- - fijiでstackTiffからstlを出力できるかもしれないけどもすでに表面構造にしてある(3DCAD/モデリング)で読み込めるファイル形式で投げてもらったほうが便利(LSMとかでとったTIFをそのまま投げたいという需要はわかるが)
- patternfileを生成した状態でwebARとして端末のカメラで出力する
- Aframeの仕組みを一通り舐める
- リポジトリをハッカソン用に作っておくか？
- 結局のところわざわざARのパターンファイルから読みこむのはよろしくないので、Sketchfabみたいなので実装するのも楽では
- もっとほんとは低いレイヤーで骨組みみたいなだけの状態にしておきたい
- スマホで気軽に研究者が自分の成果をQRでポスターなんかに貼っといて共有できる、っていうコンセプト

### おまけ
加沢先生は今回カメラの挙動なんかをブラウザで実装して行きたいらしいので、デファクトはどうなのか、とかみてとこう
https://twitter.com/yamato_tsukasa/status/1212796190472802304?s=20
タッチイベントの検出とかキーバインドをどのレベルで実装してあるのかなど

## 2020/02/20やったこと
- fiji復習
- blenderで「昆虫の脳を作る」のカイコガ標準脳を読み込ませる
- - でかすぎる
- 上記をgITF(glbバイナリ)に出力した。

### 参考にしたサイト

光断層撮影あるいは共焦点顕微鏡により撮影された臓器の断層画像の３Dプリント用データの作成方法について by 山椒魚 - DMM.make
https://media.dmm-make.com/item/3657/

X3D to OBJ - CAD Exchanger
https://cadexchanger.com/obj/x3d-to-obj

Blender でファイルのインポート，エクスポート
https://www.kkaneko.jp/dblab/cg/blenderimportexport.html

クォータニオン (Quaternion) を総整理！ ～ 三次元物体の回転と姿勢を鮮やかに扱う ～ - Qiita
https://qiita.com/drken/items/0639cf34cce14e8d58a5

3Dソフト クォータニオン ソフト別 - Google 検索
https://www.google.com/search?sxsrf=ALeKk00pcG3_hId0STMKkg3qG0fJCUBRtw%3A1582186976824&ei=4EFOXur_MYa6wAPr94TQBA&q=3D%E3%82%BD%E3%83%95%E3%83%88+%E3%82%AF%E3%82%A9%E3%83%BC%E3%82%BF%E3%83%8B%E3%82%AA%E3%83%B3+%E3%82%BD%E3%83%95%E3%83%88%E5%88%A5&oq=3D%E3%82%BD%E3%83%95%E3%83%88+%E3%82%AF%E3%82%A9%E3%83%BC%E3%82%BF%E3%83%8B%E3%82%AA%E3%83%B3+%E3%82%BD%E3%83%95%E3%83%88%E5%88%A5&gs_l=psy-ab.3...13242.15651..15893...2.0..1.605.2957.0j1j3j2j2j1......0....1..gws-wiz.......35i302i39.0Egn77uRMMY&ved=0ahUKEwjq7-Ll2d_nAhUGHXAKHes7AUoQ4dUDCAs&uact=5

3Dモデルをブラウザで見せるならSketchfabがいい | イヅツ.インフォ
https://www.izutsu.info/sketchfab.html

空間とプラットフォームの狭間で - Unityの座標変換にまつわるお話 -
https://tech.drecom.co.jp/knowhow-about-unity-coordinate-system/

その15 あべこべにしちゃいけないカメラと座標系とDirect3D
http://marupeke296.com/DXG_No15_AttentionCoordinate.html

## 2020/02/21

技術検証で一日終わってかなC
結局http(s)でログインしないとブラウザで3Dモデルを描写できないといった感じか

AFrameみたいな感じで端末のカメラを使うならばhttpsでの通信が必要なのは理解できるが、three.jsなんかもhtmlから呼び出すならば3Dの表示にapacheが必要らしい解せない(直でhtmlをブラウザで表示させようとするとglTFとbinが読み込まれない)
http://localhost:8888/www.pentacreation.com/webvr/lab/07/index.html
みたいな感じでmamp動かしてローカルホストにHTTP接続すると解決した。

ブレンダーでobjを読み込んだままではglbとして書き込み

VScode でglTfを読み込む拡張機能があった。
エンジンとしてThree.jsを動かすっていう素敵仕様
glbもいい感じに展開して読み込んでくれる
->色はどんな感じで読み込んでくれるんだろうね

結局動的に表示するオブジェクトを変えたりしないのでRubyを裏で動かしてウェブアプリにする必要はなさそう

wgetでファイルをDLしようとしたら肝心の画像データとオブジェクトのバイナリが存在してなかった
しかも存在してるので、個別にパスをエスパーして指定するとDLできた

### 結局何がやりたいのかというタスク洗い出し

#### 脳をモデル化してる人が気軽にARタグを作成できたらいいね

- ARタグを生成する
- - ARmarkerのジェネレータを置いとけば良い

- - obj とかstlみたいなのからglbに変換するジェネレータを使おうとするとOSSを駆使せねばならなくなる

- 現状ジェネレーターとしてblenderが優秀なので、とりあえずこれで妥協

### 調べたら
Three.jsでオブジェクトを選択｜Pentacreation BLOG
https://www.pentacreation.com/blog/2018/12/181213.html

glTFをThree.jsで読み込み｜Pentacreation BLOG
https://www.pentacreation.com/blog/2019/03/190303.html

クローム ソース 構造 コピー - Google 検索
https://www.google.com/search?q=%E3%82%AF%E3%83%AD%E3%83%BC%E3%83%A0+%E3%82%BD%E3%83%BC%E3%82%B9+%E6%A7%8B%E9%80%A0+%E3%82%B3%E3%83%94%E3%83%BC&oq=%E3%82%AF%E3%83%AD%E3%83%BC%E3%83%A0%E3%80%80%E3%82%BD%E3%83%BC%E3%82%B9%E3%80%80%E6%A7%8B%E9%80%A0%E3%80%80%E3%82%B3%E3%83%94%E3%83%BC&aqs=chrome..69i57.16320j0j7&sourceid=chrome&ie=UTF-8

3層ニューラルネットワークを計算式を見てみる ｜ Developers.IO
https://dev.classmethod.jp/machine-learning/nn-3-calc/

WEB+DB PRESS Vol.115｜技術評論社
https://gihyo.jp/magazine/wdpress/archive/2020/vol115

WebAR(AR.js)特定のページへジャンプする方法 - Qiita
https://qiita.com/nonkapibara/items/64ac76eab6610b0a5ee2

web 動いてるjsなど DL - Google 検索
https://www.google.com/search?q=web+%E5%8B%95%E3%81%84%E3%81%A6%E3%82%8Bjs%E3%81%AA%E3%81%A9+DL&oq=web+%E5%8B%95%E3%81%84%E3%81%A6%E3%82%8Bjs%E3%81%AA%E3%81%A9+DL&aqs=chrome..69i57.15352j1j7&sourceid=chrome&ie=UTF-8

Chromeで不要なCSS/JavaScriptを洗い出す
https://www.ecomottblog.com/?p=609

Webパフォーマンス虎の巻 - Qiita
https://qiita.com/usagi-f/items/10f35969f08dd01fa635

ASCII.jp：競合サイトのCSSとJavaScriptを丸裸にする方法
https://ascii.jp/elem/000/000/999/999122/

あの人気サービスは、Webサイトを高速化するために何をしているか | Wantedly Engineer Blog
https://www.wantedly.com/companies/wantedly/post_articles/85473

JavaScriptで水や波、パーティクル等、ふわふわゆらゆら系の動きを表現 | Webクリエイターボックス
https://www.webcreatorbox.com/tech/javascript-particles

ページのファイル構造 - Google 検索
https://www.google.com/search?sxsrf=ALeKk00zUAljvBSgb78wuSbB3bBi22mRKg%3A1582263527447&source=hp&ei=52xPXumXGZL2wAOY5YrYBw&q=%E3%83%9A%E3%83%BC%E3%82%B8%E3%81%AE%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E6%A7%8B%E9%80%A0&oq=%E3%83%9A%E3%83%BC%E3%82%B8%E3%81%AE%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E6%A7%8B%E9%80%A0&gs_l=mobile-gws-wiz-hp.3...7749.16669..16940...6.0..0.140.3075.12j17......0....1.......8..35i362i39j35i39j0i67j0i131i4j0i4j0i5i30j0i131j0i30.jdNK_pMEHoM

Chrome 78ベータに「Native File System API」搭載。Webブラウザからローカルファイルを読み書き可能に － Publickey
https://www.publickey1.jp/blog/19/chrome_78native_file_system_apiweb.html

ファイルアクセス
https://macchinetta.github.io/batch-guideline/current/ja/Ch05_FileAccess.html

web ディレクトリ構成 コピー - Google 検索
https://www.google.com/search?q=web+%E3%83%87%E3%82%A3%E3%83%AC%E3%82%AF%E3%83%88%E3%83%AA%E6%A7%8B%E6%88%90+%E3%82%B3%E3%83%94%E3%83%BC&oq=web+%E3%83%87%E3%82%A3%E3%83%AC%E3%82%AF%E3%83%88%E3%83%AA%E6%A7%8B%E6%88%90%E3%80%80%E3%82%B3%E3%83%94%E3%83%BC&aqs=chrome..69i57.14882j0j7&sourceid=chrome&ie=UTF-8

コンソールアプリケーションからWebサービスを叩いて取得したZIPファイルをローカルファイルとして保存してみた - Qiita
https://qiita.com/solve-ray/items/a9ea0294693b5eeeddf0

📃 Webページをそのままの状態でローカルに保存するツールを作った話 - Qiita
https://qiita.com/yarnaimo/items/66f3b71077d15a22699d

three_vr - Google 検索
https://www.google.com/search?q=three_vr&oq=three_vr&aqs=chrome..69i57j0l7.12929j0j7&sourceid=chrome&ie=UTF-8

WebVRを触ってみる - Qiita
https://qiita.com/shiruco/items/6d5ca9c9bbd715676a48

wget - UNIX/Linuxコマンド - IT専科
http://www.itsenka.com/contents/development/unix-linux/wget.html

webクロール - Google 検索
https://www.google.com/search?q=web%E3%82%AF%E3%83%AD%E3%83%BC%E3%83%AB&oq=web%E3%82%AF%E3%83%AD%E3%83%BC%E3%83%AB&aqs=chrome..69i57j0l7.3228j0j7&sourceid=chrome&ie=UTF-8

wget でまとめて get - ablog
https://yohei-a.hatenablog.jp/entry/20100408/1270690257

ARコンテンツ作成勉強会：OpenCVオンラインもくもく会 #01 - connpass
https://xr-fukuoka.connpass.com/event/168671/

avatar-in museum先行体験会員登録＆予約受付中！〜FLOWERS BY NAKED 2020 −桜−とのコラボ〜 | avatar-in アバターイン
https://avatarin.com/pick-up/2020/02/07/1183/

grepでこういう時はどうする? - Qiita
https://qiita.com/hirohiro77/items/771ffb64dddceabf69a3

wgetコマンドで覚えておきたい使い方16個(+1個) | 俺的備忘録 〜なんかいろいろ〜
https://orebibou.com/2016/03/wget%E3%82%B3%E3%83%9E%E3%83%B3%E3%83%89%E3%81%A7%E8%A6%9A%E3%81%88%E3%81%A6%E3%81%8A%E3%81%8D%E3%81%9F%E3%81%84%E4%BD%BF%E3%81%84%E6%96%B916%E5%80%8B/

MAMPでWebサーバー構築するまで(備忘録) - Qiita
https://qiita.com/come340/items/6cb175918075f398a41a

glTF Overview - The Khronos Group Inc
https://www.khronos.org/gltf/

【WebGL特集】第8回：各ツールからglTF形式でアニメーション出力｜3DCGアニメーションを手付けモーションでより魅力的に。株式会社モックス
https://mox-motion.com/blog/webgl08/

wget data - Google 検索
https://www.google.com/search?q=wget+data&oq=wget+data&aqs=chrome..69i57j0l7.6052j0j7&sourceid=chrome&ie=UTF-8

Blenderで作成した3Dモデルを、Three.jsでブラウザに表示する - Qiita
https://qiita.com/nannany_tis/items/c92d9f05588c751077b1

https://arprofile.netlify.com/input.html
https://arprofile.netlify.com/input.html

簡単爆速AR！(webAR) - Qiita
https://qiita.com/poccariswet/items/5f24b23341626f9e0f5d

A-FrameとAR.jsで超簡単AR（PC・スマホ・マルチマーカー対応） - Qiita
https://qiita.com/mkoku/items/c635566e829c303a7d3f

mtl to glb - Google 検索
https://www.google.com/search?q=mtl+to+glb&oq=mtl+to+glb&aqs=chrome..69i57j0.28489j0j7&sourceid=chrome&ie=UTF-8

Convert 3D models to GLTF | BlackThread.io
https://blackthread.io/gltf-converter/

【WebAR】A-frameを使ってマーカー上に3Dモデルを表示するまで - Qiita
https://qiita.com/emuyuu/items/98d04a671ed0d648334a

Blender | 位置や回転やスケールを別オブジェクトに合わせる - Road to 3DCG
http://rt3dcg.blogspot.com/2016/10/blender-transform-copy.html

【Blender】【基本操作】オブジェクトの原点を移動する - LIGHT11
https://light11.hatenadiary.com/entry/2018/09/26/000248

## 真似する
https://qiita.com/nannany_tis/items/c92d9f05588c751077b1

## In the Future

- 3D データを投げるとジェネレートされてQRコードが帰ってくる
- パフォーマンスチューニング

# おまけ
## 桝屋先生(バイオリソースセンター)

微生物だと分類学の基本になる種が登録されててそこから解析が始まるパターンが多い

NCBIのアナウンスで属レベルくらいまでしか頑張れないという話もあったほど

属レベルの"機能"は実際どういったものなんだろう

実際、NCBIでは作物を中心に配列の解析が進んでいる -> 種までわかるやつは食べ物が多い

種までの情報が手に入らない前提で研究していくのが一つの手かもしれない

分類で

配列単位で

塩基の置換がどの程度種分化に影響を与えているのか

大雑把でモノが言えるか、物が言えないのかっていうのは結局コンテクストによるのでは

マウスのデータなんかはよくあるけども

生物種までいかないと勿体無いというのはある

植物の分類研究をミツバチを使ってやればいい
(北野さんと阿辺さんと二人居てるんで)

メタゲノムは微生物でめちゃくちゃ進んでるので植物でっていうのは新しい感じがある

##