2021/07/31
はじめに
websocket を使ってみたかったので,点群(Point Cloud)を描画するアプリおよび,送信するサーバを作ってみた.
利用ライブラリ等
クライアント側は,最近好んで使ってる React, Typescript, Material-ui, Three.js, あたりを使った.
サーバ側は,使い慣れている PCL と,Boost を使った.
使い方
クローンする
clone_repository
$ git clone https://github.com/ysuzuki19/pointcloud-web-viewer
サーバを起動する
依存は,PCL と Boost と cmake
このサーバは,Websocket に何かしらのデータを受け取った時に,その相手にデータを返すもの.
pcd ファイルを準備して,server/echo/data.pcd
として保存する.
run_server
$ cd server/echo
$ mkdir build
$ cd build
$ cmake ..
$ make
$ ./server 0.0.0.0 8080
クライアントを起動する
run_client
$ cd client
$ npm install
$ npm start
おわりに
ソースコードおよびデモはこちら.
(気が向いたら,どっかのタイミングでコードについても書こうと思います.)
参考
- https://qiita.com/yonetty/itemsacc46afa59da1796a767
- https://developer.mozilla.org/en-US/docs/Web/APIWebSocket
- https://www.boost.org/doc/libs/1-70-0/libs/beast/doc/html/beastusing-websocket.html
- https://www.boost.org/doc/libs/develop/libs/beast/doc/html/beast/quick-startwebsocket-client.html
- http://man.hubwiz.com/docset/Boost.docset/Contents/Resources/Documents/boost/libs/beast/doc/html/beast/quick-startwebsocket-client.html