Canvas Map API: Difference between revisions

Jump to navigation Jump to search

Canvas Map API (view source)

Revision as of 14:32, 29 June 2014

4,655 bytes removed ,  29 June 2014
m
→‎Full Example: Creating dialogs with embedded Canvas Maps: go...
Line 67: Line 67:
* come up with a framework for MFDs
* come up with a framework for MFDs
* use the MFD framework for creating a stylable ND class
* use the MFD framework for creating a stylable ND class
== Full Example: Creating dialogs with embedded Canvas Maps ==
{{Out of date}}
At the moment, the system (and its design) is still evolving - so nothing is set in stone, and most things written here should be considered a "draft". This is also why the system makes currently some assumptions and requires certain variables/functions to be specified in the dialog XML.
(For the latest information, you'll want to refer to [[$FG_ROOT]]/gui/dialogs/airports.xml as the "de facto" example of how to use the system)
Add this to the "Nasal/open" tag of your XML dialog and customize it for your dialog:
<syntaxhighlight lang="nasal">
## "prologue" currently required by the canvas-generic-map
      var dialog_name ="airports"; #TODO: use substr() and cmdarg() to get this dynamically
      var dialog_property = func(p) return "/sim/gui/dialogs/airports/"~p; #TODO: generalize using cmdarg     
      var DIALOG_CANVAS = gui.findElementByName(cmdarg(), "airport-selection");
      canvas.GenericMap.setupGUI(DIALOG_CANVAS, "canvas-control"); #TODO: this is not a method!
      ## end of canvas-generic-map prologue
</syntaxhighlight>
Note the string "airport-selection" which should match the name of of the subsequent canvas section.
Add this to a group in the dialog where you want the Canvas to appear
<syntaxhighlight lang="xml">
  <!-- Instantiate a generic canvas map and parametrize it via inclusion -->
      <!-- TODO: use params and aliasing -->
      <canvas include="/Nasal/canvas/generic-canvas-map.xml">
<name>airport-selection</name>
        <valign>fill</valign>
        <halign>fill</halign>
        <stretch>true</stretch>
        <pref-width>600</pref-width>
        <pref-height>400</pref-height>
        <view n="0">600</view>
        <view n="1">400</view>
      <features>
<!-- TODO: use params and aliases to make this shorter -->
<!-- TODO: support styling, i.e. image sets/fonts and colors to be used -->
<!-- this will set up individual "layers" and map them to boolean "toggle" properties -->
<!-- providing an optional "description" tag here allows us to create all checkboxes procedurally -->
<dialog-root>/sim/gui/dialogs/airports</dialog-root>
<range-property>zoom</range-property>
<!-- These are the ranges available for the map:      var ranges = [0.1, 0.25, 0.5, 1, 2.5, 5] -->
<ranges>
<range>0.1</range>
<range>0.25</range>
<range>0.5</range>
<range>1</range>
<range>2.5</range>
<range>5</range>
</ranges>
<!-- available layers and their toggle property (appended to dialog-root specified above) -->
<layer>
                <name>airport_test</name>
                <init-property>selected-airport/id</init-property>      <!-- the init/input property that re-inits the layer -->
                <property>display-test</property>                    <!-- property switch to toggle the layer on/off -->
                <description>Show TestLayer</description>              <!-- GUI label for the checkbox -->
                <default>disabled</default>                              <!-- default checkbox/layer state -->
                <hide-checkbox>true</hide-checkbox>                    <!-- for default layers so that the checkbox is hidden -->
        </layer>
<layer>
<name>runways</name>
<init-property>selected-airport/id</init-property>
<property>display-runways</property>
<description>Show Runways</description>
<default>enabled</default>
<hide-checkbox>true</hide-checkbox> 
</layer>
<layer>
                <name>taxiways</name>
<init-property>selected-airport/id</init-property>
                <property>display-taxiways</property>
<description>Show Taxiways</description>
<default>disabled</default>
        </layer>
<layer>
                <name>parkings</name>
<init-property>selected-airport/id</init-property>
                <property>display-parking</property>
<description>Show Parking</description>
<default>disabled</default>
        </layer>
<layer>
                <name>towers</name>
<init-property>selected-airport/id</init-property>
                <property>display-tower</property>
<description>Show Tower</description>
<default>enabled</default>
        </layer>
<!--
<layer>
                <name>navaid_test</name>
<init-property>selected-airport/id</init-property>
                <property>display-navaids</property>
<default>disabled</default>
        </layer>
-->
      </features>
      </canvas>
</syntaxhighlight>
Add this to the "Nasal/close" tag to clean up all resources automatically:
<syntaxhighlight lang="nasal">
map.cleanup_listeners();
</syntaxhighlight>


== Also see ==
== Also see ==
* http://forum.flightgear.org/viewtopic.php?f=71&t=21139
* http://forum.flightgear.org/viewtopic.php?f=71&t=21139
Retrieved from "https://wiki.flightgear.org/Special:MobileDiff/73473"

Navigation menu