# GaugeAircraft<no value>
The `GaugeAircraft` aircraft is a preset of the [WASMAircraft](../wasmaircraft/) **modular aircraft**, which shows how to create C++ gauges for a plane in Microsoft Flight Simulator 2024 using the [Gauge API](../../../../programming-apis/wasm/gauge-api/gauge-api/). Once the {{< glossterm >}}wasm{{< /glossterm >}} Aircraft package has been built, this module will be available for flying from the aircraft selection screen:

{{< image-center
    src="images/7_Samples_Tutorials/Samples/WASMAircraft/GaugeAicraft/gauge_1_aircraft.png"
    alt="Selecting The Gauge Aircraft In The Simulation" >}}

 

The `WasmModules.sln` file (found in the `Sources` folder of the project) will allow you to compile the source-code with Microsoft Visual Studio (2019 or 2022) in order to create the `GaugeModule.wasm` WebAssembly module which will then be loaded by the simulation. Once compiled, the module will automatically be copied into the following folder

\[ROOT\]\(PackageSources\)SimObjects\(Airplanes\)MyCompany\_Wasm\_Aircraft\(presets\)mycompany\(GaugeAircraft\)panel

 

In order for the aircraft to use the {{< glossterm >}}wasm{{< /glossterm >}} gauges defined in the module, they have to be declared in the `panel.cfg` file found in the same folder. This file will have the following information to set up the gauges:

``` xml
[VCockpit01]
size_mm=1024,768
pixel_size=1024,768
texture=SCREEN_1
background_color=0,0,255
htmlgauge00=WasmInstrument/WasmInstrument.html?wasm_module=GaugeModule.wasm&wasm_gauge=Compass, 0,0,1024,768
 
[VCockpit02]
size_mm=1024,768
pixel_size=1024,768
texture=SCREEN_2
background_color=0,255,0
htmlgauge00=WasmInstrument/WasmInstrument.html?wasm_module=GaugeModule.wasm&wasm_gauge=Attitude, 0,0,1024,768
 
[Vcockpit03]
size_mm=1024,768
pixel_size=1024,768
texture=SCREEN_3
background_color=255,0,0
htmlgauge00=WasmInstrument/WasmInstrument.html?wasm_module=GaugeModule.wasm&wasm_gauge=Demo, 0,0,1024,768
```

 

As can be seen above, the gauges are referenced using the following URI scheme:

htmlgaugeNN=WasmInstrument/WasmInstrument.html?wasm\_module=\[MODULE\].wasm&wasm\_gauge=\[GAUGE\_NAME\],\[X\],\[Y\],\[WIDTH\],\[HEIGHT\]

 

Note that if you make changes to the C++ code and recompile the WebAssembly module, you will have to build the modular aircraft package again. This can be done while the plane is used within the simulation.

 

 

### Testing

Once you have built the aircraft and selected it, you can go into a **Free Flight** and you will see three panels in the cockpit:

{{< image-center
    src="images/7_Samples_Tutorials/Samples/WASMAircraft/GaugeAicraft/gauge_5_screens.png"
    alt="The Screens Added To The Gauge Aircraft" >}}

 

Each of the gauges shown corresponds to the following source code files:

-   `Attitude.cpp`: provides an implementation of an **Attitude** gauge.  

{{< image-center
    src="images/7_Samples_Tutorials/Samples/WASMAircraft/GaugeAicraft/gauge_3_altitude.png"
    alt="The Attitude Gauge In The Simulation" >}}

 

-   `Compass.cpp`: provides an implementation of a **Compass** gauge.  

{{< image-center
    src="images/7_Samples_Tutorials/Samples/WASMAircraft/GaugeAicraft/gauge_2_compass.png"
    alt="The Compass Gauge In The Simulation" >}}

 

-   `Demo.cpp`: provides a basic demo using the [NanoVG graphics API](../../../../programming-apis/wasm/low-level-api/nanovg-api/) to show how it can be implemented in your gauges ([see here](https://github.com/memononen/nanovg) for more information on NanoVG).  

{{< image-center
    src="images/7_Samples_Tutorials/Samples/WASMAircraft/GaugeAicraft/gauge_4_demo.png"
    alt="The Demo Gauge In The Simulation" >}}