CamScripter Appの概要と機能

YOUTUBEでの実際の配信

CamScripter Appは、AXISカメラの映像にリアルタイムでデータをオーバーレイするためのツールです。CamScripter Appは、ライブストリーミングの機能を強化し、データの可視化を容易にします。これにより、ユーザーは単に映像を監視するだけでなく、様々なリアルタイム情報をカメラ映像上に表示させることが可能になります。

1. 世界の空気品質指数(AQI)を映像に統合する

一例として、空気品質指数(AQI)をリアルタイムで表示するサンプルアプリケーションを使用します。AQIは、空気の汚染レベルを示す指標で、特に都市部や工業地域での健康管理に重要です。

具体的な実装方法:

  1. CamScripterを開く: まず初めにCamscripterがインストール済みのAXIZのカメラにアクセスします。その後、CamScripter Appを開きます。
  2. Micro appのインストール: CamScripter Appに、Githubで集積されているファイルの中から、「aqi_app_1_0_6.zip」というzipファイルをダウンロードします。

    ここからGithubに飛べます

  3. 各種設定: インストールが完了したら、アプリケーション開いて設定をします。カメラのIPアドレスやポート番号を確認し、ユーザー名とパスワードを入力。その後アクセストークンを取得し場所を指定します。最後に、オーバレイセッティングのフォントと画面上における座標を指定したら完了です。オートセーブになっているのでそのまま閉じて問題ありません。

2. さまざまな産業での実際の利用例

1. 自然保護区での野生動物観察

目的 自然保護区に設置されたカメラを通じて、野生動物の生態を観察し、保護活動を支援することが目的でした。
使用
方法
  • CamScripter Appを利用して、カメラからのライブ映像に動物の識別情報や現在の気象データをリアルタイムでオーバーレイ表示。
  • CamOverlayを使用して、特定の動物がカメラに映った際に自動的にその名前や特性が表示されるように設定。
効果
  • 観察者がリアルタイムで動物の種類や行動を確認できるため、保護活動の効率が向上しました。
  • 一般公開されるライブ映像にも利用され、視聴者が自然環境や野生動物に対する関心を高めるきっかけとなりました。

2. 都市部の交通監視と渋滞情報の提供

目的 大都市の交通監視カメラを使い、リアルタイムで市民やドライバーに渋滞情報を提供し、交通の流れを改善することを目的としました。
使用
方法
  • CamScripter Appを使用して、交通量データを取得し、それをライブ映像にオーバーレイ。
  • 渋滞が発生しているエリアをカメラ映像上でハイライトし、視覚的にわかりやすい形で表示。
効果
  • ドライバーは、事前に渋滞を避けるルートを選択でき、交通の流れがスムーズになりました。
  • 市民の移動時間が短縮され、都市全体の交通効率が向上しました。

3. スポーツイベントのライブストリーミング

目的 スポーツイベントのライブ配信中に、視聴者にわかりやすくスコアや選手情報を提供することが目的でした。
使用
方法
  • CamScripter Appで、試合のスコアや選手の統計データをリアルタイムで取得し、映像にオーバーレイ表示。
  • CamOverlayを使って、重要なプレーや得点シーンが発生した際に、ハイライト表示を自動的に行う機能を追加。
効果
  • 視聴者は試合の進行状況をリアルタイムで把握でき、より臨場感のある視聴体験を得ることができました。
  • イベントのライブストリーミングが視聴者数を増加させ、広告収入の向上にも寄与しました。

3. AQIプロジェクトの概要

AQIプロジェクトは、空気品質指数データを視覚的に表示するためのアプリケーションで、フロントエンド(HTML、CSS、JS)とバックエンド(データ処理、API取得)、設定管理、開発・テスト環境で構成されています。

AQIプロジェクトの構成とその目的:

1. フロントエンド構成

html/ディレクトリには、アプリケーションのユーザーインターフェースを構成するHTMLファイルが含まれています。
これらのファイルは、ブラウザ上で表示されるページのレイアウトを定義し、AQI(空気品質指数)データを視覚的に表示します。

  • index.html: アプリケーションのメインHTMLファイルで、ページの構造を決定します。
  • index.js: HTMLページでの動的な動作を処理するJavaScriptファイルです。

fonts/images/ディレクトリには、アプリケーション内で使用されるフォントや画像が保存されています。
これらの要素は、視覚的に魅力的なユーザー体験を提供するために重要です。

2. バックエンドとロジック

main.jsには、アプリケーションの主要なロジックが記述されています。ここでは、AQIデータの取得、データの処理、
そしてフロントエンドへのデータ提供が行われます。

manifest.jsonは、アプリケーションのメタデータを管理するファイルです。アプリケーションの名前やバージョン情報、必要な権限などが定義されており、
アプリケーションの挙動を制御する役割を担っています。

3. データ管理と設定

localdata/ディレクトリは、アプリケーションが使用するローカルデータや設定情報を保存する場所です。これにより、ユーザーの設定やアプリケーションの状態が記録され、
一貫した体験が提供されます。

tsconfig.jsonは、TypeScriptのコンパイラオプションを指定するファイルです。TypeScriptを使うことで、より安全で保守性の高いコードが作成できます。

4. 開発とテスト

testing/ディレクトリには、アプリケーションの機能をテストするためのスクリプトが含まれています。これにより、アプリケーションが意図通りに動作することを確認し、品質を保証します。

node_modules/には、package.jsonで指定されたすべての依存関係が含まれています。これらのモジュールは、アプリケーションの機能を支えるために必要な外部ライブラリです。

package.jsonpackage-lock.jsonは、プロジェクトの依存関係とバージョン管理を行います。これらのファイルにより、開発環境と本番環境で一貫した動作が実現します。

参考資料

CamScripter_example
CamScripter アプリ 1.x API ドキュメント
Case-studies