Skip to content

Update readme to align with rewrite #24

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
May 23, 2025
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
132 changes: 71 additions & 61 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,36 +1,40 @@
# Navigraph Navigation Data Interface for MSFS
<div align="center" >
<a href="https://navigraph.com">
<img src="https://navigraph.com/assets/images/navigraph_logo_only.svg" alt="Logo" width="80" height="80">
</a>

The Navigraph Navigation Data Interface enables developers to download and integrate navigation data from Navigraph directly into add-on aircraft in MSFS.
<div align="center">
<h1>Navigraph Navigation Data Interface for MSFS</h1>
</div>

<p>The Navigraph Navigation Data Interface enables developers to download and integrate navigation data from Navigraph directly into add-on aircraft in MSFS.</p>

<br/>
</div>

## Key Features

- Navigraph DFD Format: Leverage specialized support for Navigraph's DFD format, based on SQLite, which includes an SQL interface on the commbus for efficient data handling.
- Javascript and WASM support: The navdata interface is accessible from both Javascript (Coherent) and WASM, providing flexibility for developers.
- Supports updating of custom data formats.
- Xbox compatibility: Works on PC and Xbox.
- Persistence: All data is persisted in the `work` folder of the aircraft.

## Repository Structure

Here's an overview on the structure of this repository, which is designed to be as simple as possible to use

- `examples/`
- Contains sample implementations for using the navigation data interface
- `example/`
- `aircraft/` includes a base aircraft to test in the sim
- `gauge/` includes a very simple TypeScript instrument to communicate with the WASM module
- `src/`
- `database` Includes rust source code for interfacing with a DFD sqlite file (not WASM specific)
- `js` Includes source code for the JS interface for using the sdk
- `test` Includes code for testing the JS and Rust code using a Node runtime
- `wasm` includes the Rust source code for the WASM module which handles the downloading of the database file, and interfacing with the database implementation
- `ts` includes source code for the JS interface for interfacing with the WASM module
- `wasm` includes the Rust source code for the WASM module which handles the downloading of the database file, and interfacing with the database

## Including in Your Aircraft

1. You'll need to either build the WASM module yourself (not recommended, but documented further down) or download it from [the latest release](https://github.com/Navigraph/msfs-navigation-data-interface/releases) (alternatively you can download it off of a commit by looking at the uploaded artifacts).
2. Add the WASM module into your `panel` folder in `PackageSources`
3. Add the following entry into `panel.cfg` (make sure to replace `NN` with the proper `VCockpit` ID):

```
```ini
[VCockpitNN]
size_mm=0,0
pixel_size=0,0
Expand All @@ -39,89 +43,95 @@ Here's an overview on the structure of this repository, which is designed to be
```

- Note that if you already have a `VCockpit` with `NO_TEXTURE` you can just add another `htmlgauge` to it, while making sure to increase the index
4. **Optional**: Create a `Navigraph/config.json` file to assist with Sentry reports. This info will be reported to us should any error occur in the library. We will use this to directly reach out to you (the developer) for these errors.

- The file must look like
4. **Optional**: Create a `Navigraph/config.json` file to provide additional metadata at runtime. This info will be reported to us should any error occur in the library, enabling us to directly reach out to you (the developer) to help track down the issue.

```json
{
"addon": {
"developer": "Navigraph",
"product": "Sample Aircraft"
}
}
```
- The file must follow this format:

```json
{
"addon": {
"developer": "Navigraph",
"product": "Sample Aircraft"
}
}
```

## Dealing with Bundled Navigation Data

If you bundle outdated navigation data in your aircraft and you want this module to handle updating it for users with subscriptions, place the navigation data into the `Navigraph/BundledData` directory in `PackageSources`. You can see an example [here](examples/aircraft/PackageSources/Navigraph/BundledData/)
If you bundle outdated navigation data in your aircraft and you want this module to handle updating it for users with subscriptions, place the navigation data into the `Navigraph/BundledData` directory in `PackageSources`. You can see an example [here](example/aircraft/PackageSources/Navigraph/BundledData/)

The navigation data interface will automatically use this database by default, making it immediately available on startup.

## Where is the Navigation Data Stored?

The default location for navigation data is `work/NavigationData`.

## Building the Sample Aircraft
## Building the Sample Aircraft (MSFS2020)

Before building, make sure you have properly created and set an `.env` file in `examples/gauge`! An example can be found in the `.env.example` file in that directory. Replace with your credentials
> [!NOTE]
> This project is only meant to be tested in MSFS2020. We will add an example for MSFS2024 in the future.

1. [Download](https://nodejs.org/en/download) and install Node.js
2. Open the `msfs-navigation-data-interface` folder in a terminal
3. Run `npm i` the first time you build, in order to install dependencies
4. Change directory to `src/js` using `cd src/js`
5. Run `npm run build` to build the interface.
6. Change directory to `examples/gauge` using `cd ../../examples/gauge/`
7. Run `npm run build` to build into the `PackageSources` folder of the aircraft sample (or `npm run dev` to build into the `Packages` folder of the aircraft and listen to changes in the source).
8. Make sure the WASM module is included in the [`panel`](examples/aircraft/PackageSources/SimObjects/Airplanes/Navigraph_Navigation_Data_Interface_Aircraft/panel) folder! Look at either [Including in Your Aircraft](#including-in-your-aircraft) or [Building the WASM Module Yourself](#building-the-wasm-module-yourself) for info on that
9. Open the `examples/aircraft/NavigationDataInterfaceAircraftProject.xml` file in the simulator and build there
> [!IMPORTANT]
> Before building, make sure you have properly created and set an `.env` file in `example/gauge`! An example can be found in the `.env.example` file in that directory. Replace with your credentials.

1. Download and install [Bun](https://bun.sh/docs/installation)
2. Open this repository in a terminal
3. Run `bun i` the first time you build, in order to install dependencies
4. Change directory to [`example/gauge`](example/gauge/) using `cd example/gauge`
5. Run `bun run build` to build into the `PackageSources` folder of the aircraft sample (or `bun run dev` to build into the `Packages` folder of the aircraft and listen to changes in the source).
6. Make sure the WASM module is included in the [`panel`](example/aircraft/PackageSources/SimObjects/Airplanes/Navigraph_Navigation_Data_Interface_Aircraft/panel) folder! Look at either [Including in Your Aircraft](#including-in-your-aircraft) or [Building the WASM Module Yourself](#building-the-wasm-module-yourself) instructions
7. Open the `example/aircraft/NavigationDataInterfaceAircraftProject.xml` file in the simulator and build there

## Building the WASM Module Yourself

1. [Install](https://github.com/navigraph/cargo-msfs) cargo-msfs
2. Run `npm run build:wasm` (must be on Windows)
1. Create a `.env` file in the root of this repository, containing a `SENTRY_URL` variable. Provide your own DSN, or leave it empty.
2. Run `bun run build:wasm` at the root of the repository (requires Docker)
- This will take a while to download and build the first time, but subsequent runs will be quicker
3. The compiled WASM module will be copied to `out` **and** `examples/aircraft/PackageSources/SimObjects/Airplanes/Navigraph_Navigation_Data_Interface_Aircraft/panel`
3. The compiled WASM module will be copied to `dist/wasm`. There will be two folders - `2020` and `2024`, for each sim version

## Interfacing with the gauge manually

The navigation data interface acts as its own WASM gauge in sim, so in order to communicate with it, you must use the [CommBus](https://docs.flightsimulator.com/html/Programming_Tools/WASM/Communication_API/Communication_API.htm).

The gauge communicates using the following event names:

(Any types referenced can be found in `wasm/src/json_structs.rs`)
The gauge communicates using the following event names (all types referenced can be found [here](src/ts)):

- `NAVIGRAPH_CallFunction`: This event is received by the interface and is used to trigger one of the interfaces functions. It takes in arguments of type `CallFunction`. The available functions and their expected parameters can be found in the `json_structs.rs` file
- `NAVIGRAPH_CallFunction`: This event is received by the interface and is used to trigger one of the interfaces functions. It takes in arguments of type `CallFunction`. The available functions and their expected parameters can be found in the [`src/ts`](src/ts) file
- `NAVIGRAPH_FunctionResult`: This event is sent by the interface as a response to a previously triggered function. Its result will have the type `FunctionResult`, with the data field containing the expected return type of the function.
- `NAVIGRAPH_Event`: This event is sent by the interface to give indications of progress or that the interface is running correctly.

### Example

Below is an example of communicating with the interface in JS. (We provide a JS wrapper, the code below is just a basic example to show how it works). Please read the CommBus documentation to determine how to interface with CommBus in your chosen language. `src/js` contains our JS wrapper, it is also a useful example for implementing a fully fleshed out wrapper.
Below is an example of communicating with the interface in JS. Please read the CommBus documentation to determine how to interface with CommBus in your chosen language. [`src/ts`](src/ts) contains our JS wrapper, it is also a useful example for implementing a fully fleshed out wrapper.

> [!IMPORTANT]
> We provide a JS wrapper that handles this for you. The below is just a quick look at how it works.

```js
const queue = []
const queue = [];

const listener = RegisterCommBusListener(() => {
listener.on("NAVIGRAPH_FunctionResult", jsonArgs => {
const args = JSON.parse(jsonArgs)
const args = JSON.parse(jsonArgs);

// When a FunctionResult is received, find the item in queue which matches the id, and resolve or reject it
const queueItem = queue.find(m => m.id === args.id)
const queueItem = queue.find(m => m.id === args.id);

if (queueItem) {
queue.splice(queue.indexOf(queueItem), 1)
const data = args.data
queue.splice(queue.indexOf(queueItem), 1);
const data = args.data;

if (args.status === FunctionResultStatus.Success) {
queueItem.resolve(data)
queueItem.resolve(data);
} else {
queueItem.reject(new Error(typeof data === "string" ? data : "Unknown error"))
queueItem.reject(new Error(typeof data === "string" ? data : "Unknown error"));
}
}
})
}) // RegisterCommBusListener is a function provided by sim
});
}); // RegisterCommBusListener is a function provided by sim

function getAirport(ident) {
const id = Utils.generateGUID() // Utils is a class provided by sim
const id = Utils.generateGUID(); // Utils is a class provided by sim

const args = {
function: "GetAirport", // The name of the function being called
Expand All @@ -130,21 +140,21 @@ function getAirport(ident) {
// The parameters of the function
ident,
},
}
};

listener.callWasm("NAVIGRAPH_CallFunction", JSON.stringify(args))
listener.callWasm("NAVIGRAPH_CallFunction", JSON.stringify(args));

return new Promise((resolve, reject) => {
queue.push({
id,
resolve: response => resolve(response),
reject: error => reject(error),
})
})
});
});
}

function executeSql(sql, params) {
const id = Utils.generateGUID() // Utils is a class provided by sim
const id = Utils.generateGUID(); // Utils is a class provided by sim

const args = {
function: "ExecuteSQLQuery", // The name of the function being called
Expand All @@ -154,16 +164,16 @@ function executeSql(sql, params) {
sql,
params,
},
}
};

listener.callWasm("NAVIGRAPH_CallFunction", JSON.stringify(args))
listener.callWasm("NAVIGRAPH_CallFunction", JSON.stringify(args));

return new Promise((resolve, reject) => {
queue.push({
id,
resolve: response => resolve(response),
reject: error => reject(error),
})
})
});
});
}
```