MAVCesium - An experimental web based map display for MAVProxy based on Cesium

UPDATE

This project is currently being re-written from the ground up with a reactive javascript framework (vue js) and graphql for communication. It is being integrated into a new web based GCS, designed to configure and control many decentralised vehicles simultaneously. If you would like to learn more about where we are taking this project go to https://github.com/goodrobots/maverick-web or say hello in our developer gitter channel https://gitter.im/goodrobots/dev.

Notes: Your browser will need to support webgl and web sockets. Please view on a desktop machine as the application does not currently support responsive layouts.

About the project

As a ground control station operator I often find myself wishing MAVProxy had a more intuitive way of displaying an air vehicle attitude and position. This project uses Cesium to display the position and attitude information being received by a MAVProxy ground station in real time.

Note: MAVCesium can now run stand alone from MAVProxy. See this issue if you would like to know more.

Video

]

Screenshots

Development

Although currently under development, this module provides a usable position and attitude display, HUD, geofence display and limited mission display capabilities.

On the TODO list...

• Improved mission display and planning capabilities
• Real time visualisation of sensor footprints and data feeds (video and image)
• Support for custom digital elevation maps
• Support for custom ground imagery
• Log playback from .tlog and .bin files
• Support responsive layouts
• etc...

Development is being undertaken on a Ubuntu 16.04 x64 machine and has been tested on a 14.04 x64 machine. As the (few) dependencies are pure python I expect it will install and run on a windows machine, however this is currently untested.

How it works

When you load the MAVCesium module a single tornado server is created. This server handles handles static data requests while also streaming JSON between MAVProxy and your webgl enabled browser, driving the display.

The display is updated only as new data is received via the telemetry stream, so the faster the telemetry stream the 'smoother' the display update will be.

Getting it running (through MAVProxy's module loader)

The following assumes that you have already installed the requirements for MAVProxy

• Install the python dependencies for MAVCesium located in requirements.txt via pip

• MAVCesium is avalable as a git submodule of MAVProxy. If you already have an existing MAVProxy repository setup, you can initialise the MAVCesium module by running the following in your MAVProxy base directory:

git submodule update --init --recursive

Otherwise if you would like to clone MAVProxy and get the MAVCesium module at the same time you can run the following command:

git clone --recurse-submodules https://github.com/ArduPilot/MAVProxy.git

You can then install MAVProxy as per the developer guide:

• Run MAVProxy and load the MAVCesium module with the module load cesium command in the MAVProxy console

• Point your webgl enabled browser to http://127.0.0.1:5000/mavcesium/ and once you start receiving valid mavlink messages from the vehicle connected to the MAVProxy ground station you will see the vehicle model in the center of your screen with a HUD overlay

• If you have other computers / tablets / ipads on your network you can also open webgl capable browsers on them and point it to the network facing IP address of the computer that MAVProxy is running on.

• For bonus points replace the Griffon Aerospace MQM-170 Outlaw gltf model with something that resembles your air vehicle! You can convert .dae models to .gltf using this online tool

Getting it running (standalone)

You can also run it standalone.

In ArduPilot, run SITL.

./Tools/autotest/sim_vehicle.py -v Plane 

Then, start the cesium_web_server.

cd app
./cesium_web_server.py

Each time you change code, you must kill the Tornado server, restart it, and refresh the web page.

Module usage

The top bar of the MAVCesium display contains similar data to the MAVProxy map. Here you will find the cursor lat, lon, alt and information on left click positions. You can access the context menu via single right click, while camera controls and settings can be found in the upper right of the screen. HUD overlay visibility can be toggled by pressing h when the MAVCesium display is active and can be made smaller via a button in the settings menu.

Further documentation is under construction here

If you get it running or find it useful let me know :) Issues and pull requests welcome!

Credits

Some of the other projects which go into MAVCesium are: Cesium MAVProxy Ardupilot tornado jQuery Bootstrap Font Awesome