Contents ======== * `Contents <#contents>`__ * `Multimodal Data Visualization Microservice for EII <#multimodal-data-visualization-microservice-for-eii>`__ * `Prerequisites <#prerequisites>`__ * `Run the Containers <#run-the-containers>`__ * `Grafana Overview <#grafana-overview>`__ * `Grafana Configuration <#grafana-configuration>`__ * Run Grafana in the PROD Mode(\ ``[WORK_DIR]/IEdgeInsights/Visualizer/run-grafana-in-the-prod-mode``\ ) * Run Grafana for a Video Use Case(\ ``[WORK_DIR]/IEdgeInsights/Visualizer/run-grafana-for-a-video-use-case``\ ) Multimodal Data Visualization Microservice Overview --------------------------------------------------- The Multimodal Data Visualization microservice provides functionality to represent the data graphically. Using this service, you can visualize the video streaming and Time Series data. The following containers run as a part of the Multimodal Data Visualization microservice: * multimodal-data-visualization * multimodal-data-visualization-streaming The ``multimodal-data-visualization-streaming`` container gets the ingested frames and the inference results from the MsgBus subscriber and it then renders the video to a webpage. This webpage is embedded in Grafana* to visualize the video stream and the Time Series data on the same dashboard. This directory provides a Docker compose and config file to use the Multimodal Data Visualization microservice with the Edge Insights for Industrial software stack. Prerequisites ^^^^^^^^^^^^^ As a prerequisite for the Multimodal Data Visualization microservice, complete the following steps: #. EII when downloaded from ESH would be available at the installed location .. code-block:: sh cd [EII installed location]/IEdgeInsights #. Complete the prerequisite for provisioning the EII stack. For more information, refer to the `README.md `_. #. Run the following commands to set the environment and build the ``ia_configmgr_agent`` container: .. code-block:: sh cd [WORK_DIR]/IEdgeInsights/build # Execute the builder.py script python3 builder.py -f usecases/video-streaming.yml Run the Containers ^^^^^^^^^^^^^^^^^^ To pull the prebuilt EII container images and Multimodal Data Visualization microservice images from Docker Hub and run the containers in the detached mode, run the following command: .. code-block:: sh # Start the docker containers docker-compose up -d .. note:: The prebuilt container image for the `Multimodal Data Visualization microservice `_ gets downloaded when you run the ``docker-compose up -d`` command, if the image is not already present on the host system. Interfaces Section ~~~~~~~~~~~~~~~~~~ In the EII mode, the endpoint details for the EII service you need to subscribe from are to be provided in the **Subscribers** section in the config(\ ``[WORK_DIR]/IEdgeInsights/Visualizer/config.json``\ ) file. For more details on the structure, refer to the `EII documentation `_. Grafana Overview ~~~~~~~~~~~~~~~~ Grafana supports various storage backends for the Time Series data (data source). EII uses InfluxDB as the data source. Grafana connects to the InfluxDB data source that is preconfigured as a part of the Grafana setup. The ``ia_influxdbconnector`` and ``ia_webservice`` service must be running for Grafana to be able to collect the Time Series data and stream the video respectively. After the data source starts working, you can use the preconfigured dashboard to visualize the incoming data. You can also edit the dashboard as required. After the Multimodal Data Visualization microservice is up, you can access Grafana at ``http://:3000`` Grafana Configuration """"""""""""""""""""" The following are the configuration details for Grafana: * dashboard.json(\ ``[WORK_DIR]/IEdgeInsights/Visualizer/multimodal-data-visualization/eii/dashboard.json``\ ): This is the dashboard json file that is loaded when Grafana starts. It is preconfigured to display the Time Series data. * dashboards.yml(\ ``[WORK_DIR]/IEdgeInsights/Visualizer/multimodal-data-visualization/eii/dashboards.yml``\ ): This is the config file for all the dashboards. It specifies the path to locate all the dashboard json files. * datasources.yml(\ ``[WORK_DIR]/IEdgeInsights/Visualizer/multimodal-data-visualization/eii/datasources.yml``\ ): This is the config file for setting up the data source. It has various fields for data source configuration. * grafana.ini(\ ``[WORK_DIR]/IEdgeInsights/Visualizer/multimodal-data-visualization/eii/grafana.ini``\ ): This is the config file for Grafana. It specifies how Grafana should start after it is configured. .. note:: You can edit the contents of these files based on your requirement. Run Grafana in the PROD Mode """""""""""""""""""""""""""" .. note:: Skip this section, if you are running Grafana in the DEV mode. To run Grafana in the PROD mode, import ``cacert.pem`` from the ``build/Certificates/rootca/`` directory to the browser certificates. Complete the following steps to import certificates: #. In Chrome browser, go to **Settings**. #. In **Search settings**\ , enter **Manage certificates**. #. In **Privacy and security**\ , click **Security**. #. On the **Advanced** section, click **Manage certificates**. #. On the **Certificates** window, click the **Trusted Root Certification Authorities** tab. #. Click **Import**. #. On the **Certificate Import Wizard**\ , click **Next**. #. Click **Browse**. #. Go to the ``IEdgeInsights/build/Certificates/rootca/`` directory. #. Select the **cacert.pem** file, and provide the necessary permissions, if required. #. Select all checkboxes and then, click **Import**. Run Grafana for a Video Use Case ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Complete the following steps to run Grafana for a video use case: #. Ensure that the endpoint of the publisher, that you want to subscribe to, is mentioned in the **Subscribers** section of the config(\ ``[WORK_DIR]/IEdgeInsights/Visualizer/config.json``\ ) file. #. Use **root** as the **Username** and **eii123** **Password** both for first login, password can be changed if required when prompted after logging in. #. On the **Home Dashboard** page, on the left corner, click the Dashboards icon. #. Click the **Manage Dashboards** tab, to view the list of all the preconfigured dashboards. #. Select **EII Video and Time Series Dashboard**\ , to view multiple panels with topic names of the subscriber as the panel names along with a time-series panel named ``Time Series``. #. Hover over the topic name. The panel title will display multiple options. #. Click **View** to view the subscribed frames for each topic. .. note:: * Changing gridPos for the video frame panels is prohibited since these values are altered internally to support multi-instance. * Grafana does not support visualization for GVA and CustomUDF streams.