MapInstrument.js

Questions & Community Discussions
1

MapInstrument is a gem of a stock JS class which allows any 3rd-party dev to render a moving map onto a html/js gauge.

But as far as I can tell MapInstrument is hard-coded to render into a 1000x1000 pixel area. A larger div can be used but then calls to move the center of the map to a new lat/long (i.e. the crucial moving map fn call) will break, positioning that lat/long at the xy 500,500 coordinates regardless of the size of the div/map.

Anyone got around this limitation in MapInstrument, or found another class that renders the map without that 1000x1000 fixed size requirement?

2

We recommend using Map system and associated classes from the MSFS Avionics Framework, which are much more flexible, have a monadic builder-style API for ease of adding the layers desired, and offers the ability to add custom styling and sizing with a good deal more performance.

You can find those here: msfs-avionics-mirror/src/sdk/components/mapsystem at main · microsoft/msfs-avionics-mirror · GitHub

Cheers,
Matt

1 Like
3

Does Working Title have a documented component that draws a map that can be included in a plain html/js gauge? Or are the Garmins just using the Asobo MapInstrument? The map would be the canonical component demonstrating value. Or can’t any WT components be used outside their toolchain anyway?

4

The MapSystem API is used in the following instruments (all of which are JS instruments):

  • Sim panel VFR Map
  • G1000 NXi
  • G3000/5000
  • GNS430W/530W
  • G3X (SU15)
  • WT21 (CJ4)
  • Boeing 787-10
  • Boeing 747-8i

The source for the Garmins and the WT21 are available on the repo, if you need any examples. We don’t have anything that is not Typescript/TSX (and we highly recommend even small projects use Typescript/TSX) but you can always compile it to JS if you want to use it from there.

-Matt

1 Like