|
|
| (131 intermediate revisions by 2 users not shown) |
| Line 1: |
Line 1: |
| This page describes how to create a Maria GDK map client utilising '''''MariaGlobeMapControl''''' with 2D and 3D visualisation of map, tracks and draw objects.
| | [[File:Globe-3D.PNG|right|thumb|Maria Globe Client]] |
|
| |
|
| [[File:Globe-3D.PNG|right|thumb|Maria Globe Client]]
| | These pages describe how to create a Maria GDK map client utilising '''''MariaGlobeMapControl''''' with 2D and 3D visualisation of map, tracks and draw objects. |
|
| |
|
| == General == | | == General == |
|
| |
|
| * You will need to include the following NuGet package: | | ; Note |
| ** '''''TPG.Maria.MariaGlobeMapControl''''' (Currently available Teleplan Globe internal only)
| | :* You will need to include the '''''TPG.MariaGDK3D''''' NuGet package. (Currently available Teleplan Globe internal only) |
| | | :: For more info, see [[Development requirements#Loading Maria GDK Packages| Loading Maria GDK, NuGet Packages]] |
| * Sample code is found in the '''''MariaGlobeClient''''' project, in the '''''Sample Projects''''' solution. | | :* Sample code is found in the '''''MariaGlobeClient''''' project, in the '''''Sample Projects''''' solution. |
| ** Note that the sample code is specifying the service connections in ''code'', and not by '''''app.config'''''.
| | :* Note that the sample code is specifying the service connections in ''code'', and not by '''''app.config'''''. |
| | | :* For general troubleshooting, see [[Development_troubleshooting|Development troubleshooting]] |
| == Utilising the globe control ==
| |
| | |
| === Including MariaGlobeMapControl ===
| |
| | |
| Create a WPF Application, and add reference to the '''''TPG.Maria.MariaGlobeMapControl''''' package. <br/>
| |
| For NuGet details, see ''[[Basic map client|Maria Basic Map Client]]''.
| |
| | |
| Add the '''''MariaGlobeMapControl''''' to the Main window xaml.
| |
| | |
| <source lang="xml">
| |
| <Window x:Class="MariaGlobeClient.MainWindow"
| |
| . . .
| |
| Title="MariaGlobeClient" Height="600" Width="600">
| |
| <Grid>
| |
| <MariaGlobeMapControl x:Name="MariaGlobeCtrl" Background="#E9ECFA"
| |
| Layers="{Binding Layers}"
| |
| MiniMapLayer="{Binding MapViewModel.MiniMapLayer, Mode=OneWay}"
| |
| CenterScale="{Binding MapViewModel.CenterScale}"
| |
| CenterPosition="{Binding MapViewModel.CenterPosition}"
| |
| MouseMoveDistanceToStartTracking="0"
| |
| ZoomOnDblClick="False"
| |
| DegreeToLockRotateAndScale="2"
| |
| PercentageToLockScaleOnly="2.0"
| |
| Is3DMode="False"
| |
| IsRulerVisible="True"
| |
| IsCenterPositionIndicatorEnabled="True"
| |
| IsMiniMapVisible="True" />
| |
| </Grid>
| |
| </Window>
| |
| </source>
| |
| | |
| === Add view models ===
| |
| | |
| * Add a view model class (''MainViewModel'') for communication with the Maria component, and another (''MapViewModel'') for map handling. Both including inheritance of '''''ViewModelBase''''', for details see [[Map_interaction_client/Prepare_your_application_for_interactions|''Prepare your application for interactions'']]. | |
| | |
| * Set the data context of your client window to the '''''MainViewModel''''', and implement an event handler for the '''''WindowClosing''''' event. For details see [[Basic map client|Maria Basic Map Client]].
| |
| | |
| ==== MainViewModel ====
| |
| | |
| Extend the inheritances to include the '''''IMariaGlobeMapViewModel''''' and implement the interface.
| |
| | |
| <source lang="c#">
| |
| public class MainViewModel : ViewModelBase, IMariaGlobeMapViewModel
| |
| {
| |
| public IGlobeMapManager GlobeMapManager { get; }
| |
| public IDrawObjectLayerFactory DrawObjectLayerFactory { get; private set; }
| |
| public IGlobeMapViewModel GlobeMapViewModel { get; set; }
| |
| ...
| |
| </source>
| |
| | |
| Add the following fields and properties:
| |
| | |
| <source lang="c#">
| |
| . . .
| |
| private IMariaMapLayer _mapLayer;
| |
| private IMariaMapLayer _miniMapLayer;
| |
| | |
| public MapViewModel MapViewModel { get; }
| |
| public ObservableCollection<IMariaLayer> Layers { get; set; }
| |
| . . .
| |
| </source>
| |
| | |
| In the constructor:
| |
| * initialise the Layer property
| |
| * set up the map services
| |
| * create the GlobeMapManager
| |
| * create map layer, mini-map layer and add to the '''''Layers''''' property
| |
| * instanciate the MapViewModel
| |
| | |
| | |
| <source lang="c#">
| |
| ...
| |
| public MainViewModel()
| |
| {
| |
| Layers = new ObservableCollection<IMariaLayer>();
| |
| | |
| IBindingFactory bindingFactory = new BindingFactory();
| |
| IEndpointAddressFactory endpointAddressFactory = new EndpointAddressFactory();
| |
| | |
| // Set up template client
| |
| var mapTemplateServiceClient = new MapTemplateServiceClientFactory(
| |
| bindingFactory,
| |
| endpointAddressFactory).New("http://tpg-geostore:9008/maptemplates", BindingType.BasicHttp);
| |
| | |
| // Set up catalog service client and connect to service
| |
| var mapCatalogServiceClient = new MapCatalogServiceClient(
| |
| bindingFactory.New(BindingType.BasicHttp),
| |
| endpointAddressFactory.New("http://tpg-geostore:9008/catalog"));
| |
| | |
| GlobeMapManager = new GlobeMapManager(mapCatalogServiceClient, mapTemplateServiceClient);
| |
| GlobeMapManager.TileCacheManager.MaxCacheSize = 250;
| |
| | |
| _mapLayer = new MapLayer(GlobeMapManager);
| |
| _miniMapLayer = new MapLayer(GlobeMapManager);
| |
| Layers.Add(_mapLayer);
| |
| | |
| MapViewModel = new MapViewModel(_mapLayer, _miniMapLayer);
| |
| }
| |
| | |
| </source>
| |
| | |
| Make the class disposable by including and implementing '''''IDisposable'''''.
| |
| | |
| <source lang="c#">
| |
| ...
| |
| public class MainViewModel : ViewModelBase, IMariaGlobeMapViewModel, IDisposable
| |
| {
| |
| ...
| |
| public void Dispose()
| |
| {
| |
| _mapLayer?.Dispose();
| |
| _miniMapLayer?.Dispose();
| |
| GlobeMapViewModel?.Dispose();
| |
| }
| |
| </source>
| |
| | |
| ==== MapViewModel ====
| |
| | |
| Add the following fields and properties:
| |
| | |
| <source lang="c#">
| |
| ...
| |
| private readonly IMariaMapLayer _mapLayer;
| |
| | |
| public IMariaMapLayer MiniMapLayer { get; private set; }
| |
| public GeoPos CenterPosition { get; set; }
| |
| public double CenterScale { get; set; }
| |
| ...
| |
| </source>
| |
| | |
| Create a constructor, taking map layer and and mini-map layer as parameters and initialising map and mini-map event handling.
| |
| | |
| <source lang="c#">
| |
| public MapViewModel(IMariaMapLayer mapLayer, IMariaMapLayer miniMapLayer)
| |
| {
| |
| _mapLayer = mapLayer;
| |
| | |
| if (_mapLayer != null)
| |
| _mapLayer.LayerInitialized += OnMapLayerInitialized;
| |
| | |
| MiniMapLayer = miniMapLayer;
| |
| if (MiniMapLayer != null)
| |
| MiniMapLayer.LayerInitialized += OnMiniMapLayerInitialized;
| |
| }
| |
| </source>
| |
| | |
| Implement the '''''LayerInitialized''''' event handlers for the map and mini map.
| |
| | |
| <source lang="c#">
| |
| ...
| |
| private void OnMapLayerInitialized()
| |
| {
| |
| CenterPosition = new GeoPos(59.908358, 10.628190); // TPG - Lysaker
| |
| CenterScale = 1000000;
| |
| | |
| _mapLayer.ActiveMapTemplate = _mapLayer.ActiveMapTemplates.Any() ? _mapLayer.ActiveMapTemplates.First() : null;
| |
| }
| |
| | |
| private void OnMiniMapLayerInitialized()
| |
| {
| |
| MiniMapLayer.ActiveMapTemplate = _mapLayer.ActiveMapTemplates.Any() ? _mapLayer.ActiveMapTemplates.First() : null;
| |
| }
| |
| ...
| |
| </source>
| |
| | |
| === Running the globe client ===
| |
| | |
| Running your application, the window area should now include 2D map information and mini map - and you should be able to navigate the map!
| |
| | |
| [[File:Globe_First-2D.PNG|none|frame|Globe client with 2D map]]
| |
| | |
| To start the globe client in #D mode, Change the '''''Is3DMode''''' property of the '''''MariaGlobeMapControl''''' to ''True'', and start the application again.<br>
| |
| | |
| The window area should now include 3D map information - and you should be able to navigate the 3D-map!
| |
| | |
| | |
| [[File:Globe_First-3D.PNG|none|frame|Globe client with 3D map]]
| |
| | |
| == Globe interaction ==
| |
| | |
| === Map interaction ===
| |
| | |
| ==== Map utilities ====
| |
| The different map utilities can be turned on/off programatically e.g. through User controlls.
| |
| | |
| Here is an example of adding check boxes with direct binding to the '''''MariaGlobeMapControl''''' from your main window.
| |
| | |
| <source lang="xml">
| |
| ...
| |
| | |
| To be described ...
| |
| | |
| ...
| |
| </source>
| |
| | |
| ==== Map settings ====
| |
| | |
| | |
| | |
| <source lang="xml">
| |
| ...
| |
|
| |
|
| To be described ...
| | == Sections == |
| | ;The following main topics are handled: |
|
| |
|
| ... | | {| class="wikitable" |
| </source>
| | |- |
| | | |
| | ;1. [[Maria_globe_client/Utilising_the_globe_control|Utilising the globe control]] |
| | | |
| | [[File:Globe_First-3D.PNG|150px|link=Maria_globe_client/Utilising_the_globe_control]] |
| | |- |
| | | |
| | ;2. [[Maria_globe_client/Map_interaction|Map interaction]] |
| | | |
| | [[File:Map_Pref_3D.PNG|150px|link=Maria_globe_client/Map_interaction]] |
| | |- |
| | | |
| | ;3. [[Maria_globe_client/Draw_object_interaction|Draw object interaction]] |
| | | |
| | [[File:DrawObjects_3D.PNG|150px|link=Maria_globe_client/Draw_object_interaction]] |
| | |- |
| | | |
| | ;4. [[Maria_globe_client/Track_interaction|Track interaction]] |
| | | |
| | [[File:Track_3D.PNG|150px|link=Maria_globe_client/Track_interaction]] |
| | |- |
| | | |
| | ;5. [[Maria_globe_client/Auto_follow|Auto follow]] |
| | | |
| | [[File:Auto_follow_track_3D.PNG|150px|link=Maria_globe_client/Auto_follow]] |
| | |- |
| | | |
| | ;6. [[Maria_globe_client/Advanced_map_settings|Advanced map settings]] |
| | | |
| | [[File:3D_Set_P15_Y120_R30_af.png|150px|link=Maria_globe_client/Advanced_map_settings]] |
| | |} |
|
| |
|
| === Track interaction ===
| |
|
| |
|
| === Draw object interaction ===
| |
|
| |
|
| === Autofollow ===
| | [[Category:Creating applications]] |
| === Monitoring service connections ===
| |
