Skip to content

Commit 59260e7

Browse files
authored
Update WebCFace ReadMe
1 parent f51feb6 commit 59260e7

File tree

1 file changed

+42
-14
lines changed

1 file changed

+42
-14
lines changed

contents/projects/webcface/index.mdx

Lines changed: 42 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -8,17 +8,45 @@ tags: [C++, Python, JavaScript, TypeScript, WebSocket, MessagePack, React]
88
github: https://github.com/na-trium-144/webcface
99
---
1010

11-
WebSocket と MessagePack を使った、 ROS のような分散型の通信ライブラリです。
12-
クロスプラットフォーム (Windows, macOS, Linux) かつ複数の言語間 (C++, Python, JavaScript) で通信ができます。
13-
14-
Web ブラウザーでアクセスできる UI(WebUI) が付属しており、ネットワーク上の PC やタブレットなどからアクセスして WebCFace で通信されているデータを可視化したり関数を呼び出したりできます。
15-
また、 WebUI からのアクセスを想定してテキストやボタンなどの配置を指定すると簡易な UI を作成することができます。
16-
17-
データ型を任意に定義できる ROS とは違って、通信できるデータの種類が以下のように限定されています
18-
* Pub/Sub 通信
19-
* Value: 実数 or 実数の配列
20-
* Text: UTF-8 文字列
21-
* View: UI レイアウト
22-
* Log: 時刻とログレベルつきの文字列ストリーム
23-
* その他
24-
* Func: 関数 (他クライアントから引数とともに呼び出し、値を返す)
11+
* ROS1 のようなプロセス間通信と、GUI によるデータの可視化や関数呼び出し、また Immediate-Mode でのシンプルな UI の作成ができます。
12+
* C++ (C++17以上), C, Python (3.6以上), JavaScript/TypeScript で相互に数値、文字列、画像などのデータを送受信したり、関数を呼び出したりすることができます。
13+
* Linux, MacOS, Windows(MSVC, MinGW, MSYS2, Cygwin) で動作します。
14+
15+
## Easy to Setup
16+
17+
WebCFace はサーバー側のプログラム `webcface-server` と、 クライアントライブラリで構成されています。 使い方はサーバーを起動し、クライアントライブラリを利用したプログラムを起動するだけです。 ROS のようなワークスペース管理機能はなく、どんなフレームワークのプロジェクトにも簡単に組み込むことができます。
18+
19+
Python, JavaScript には PyPI / npm に webcface パッケージを用意しているのでそれをインストールするだけで使えます。 通信にWebSocketを使用しているため、Webブラウザ上でもそのまま動作します。
20+
21+
## Inter-process Communication
22+
23+
WebCFace の通信には WebSocket と MessagePack を使っています。 このためプロセス間だけでなく Web ブラウザーとの通信が可能になっています。 さらに同一マシン上や Docker, WSL 経由など使用可能な場合は TCP の代わりに Unix ドメインソケットを使用します。
24+
25+
WebCFaceで送受信できるデータ型として
26+
27+
* 数値型・数値配列型 (Value)
28+
* 文字列型 (Text)
29+
* 画像 (Image)
30+
* 関数呼び出し (Func)
31+
* テキストログ (Log)
32+
33+
などの型が用意されています。 ユーザーがメッセージ型を定義できる ROS や gRPC と比べると自由度は低いかもしれませんが、 これらのデータ型の組み合わせであれば簡単に送受信させることができます。
34+
35+
Image 型データは送受信の過程で画像を縮小したり JPEG や PNG に圧縮したりといった操作をサーバー側で行うことができます。 表示目的など、圧縮した画像で十分な場合には簡単に通信量を削減できます。
36+
37+
WebCFace の通信データ形式は OS やライブラリの言語によらず共通で、またバージョン間で後方互換性があります。 つまり、サーバーがクライアントより新しいバージョンでさえあれば、異なるバージョンのクライアント同士でも、異なるバージョンの OS でも問題なく通信が可能です。
38+
39+
## WebUI
40+
41+
WebCFace ではプログラム間でデータの送受信ができる API だけでなく、 Web ブラウザーから WebCFace で通信されているデータを可視化したり関数を呼び出したりできる UI (WebUI) を提供します。 さらにボタンや入力欄などの並べ方を WebCFace を使った C++, Python などのプログラムの側で定義してそれを WebUI に表示させることができ、 これにより HTML や CSS の知識がなくても簡易な UI を作成することができます。
42+
43+
また、同様に 2D、3D の図形も WebCFace を使ったプログラム側の記述のみで WebUI に描画させることができます。
44+
45+
## WebCFace-Tools
46+
47+
コマンドラインから WebCFace のデータにアクセスできるコマンドもいくつか用意しています。
48+
49+
webcface-launcher は事前に登録しておいたコマンドの起動・停止を WebCFace の View から操作することができる機能です。 server と launcher だけを常時起動しておき、WebUI を使ってプログラムをリモートに操作するという使い方ができます。
50+
51+
webcface-tui はターミナル上で操作できる TUI アプリで、Web ブラウザを開かなくてもデータをリアルタイムで確認したり、View の操作もできます。
52+

0 commit comments

Comments
 (0)