2-757: Leveraging Maps and Location Across Phone, Tablet, and PC in Your Windows Apps

Windows 10 brings a converged, superset version of our existing phone and desktop map controls and location platforms (i.e. offline maps, better traffic data) in addition to new and exciting scenarios such as Streetside and real 3D imagery. In this session, we’ll demonstrate how Windows itself is taking advantage of our maps platform in our Maps application and how you can easily delight your customers with maps in your Windows apps!

1.0x

2-757: Leveraging Maps and Location Across Phone, Tablet, and PC in Your Windows Apps

Created 2 years ago

Duration 1:03:47
lesson view count 1073
Windows 10 brings a converged, superset version of our existing phone and desktop map controls and location platforms (i.e. offline maps, better traffic data) in addition to new and exciting scenarios such as Streetside and real 3D imagery. In this session, we’ll demonstrate how Windows itself is taking advantage of our maps platform in our Maps application and how you can easily delight your customers with maps in your Windows apps!
Select the file type you wish to download
Slide Content
  1. Rohan Thakkar, Mike Ammerlaan

    Slide 1 - Rohan Thakkar, Mike Ammerlaan

    • Leveraging Maps and Location Across Phone, Tablet, and PC in Your Windows Apps
    • 2-757
  2. Leveraging Maps and Location across Phone, Tablet, and PC in Your Windows Apps

    Slide 2 - Leveraging Maps and Location across Phone, Tablet, and PC in Your Windows Apps

    • Rohan Thakkar, Mike Ammerlaan
    • Session Code - 757
  3. 16500 BC

    Slide 3 - 16500 BC

    • 1000 -1400
    • Evolution of cartography
    • 1500 -1800
    • 1989 - 2010
    • 2010 - 2014
  4. Rohan Thakkar, Mike Ammerlaan

    Slide 4 - Rohan Thakkar, Mike Ammerlaan

    • Leveraging Maps and Location across Phone, Tablet, and PC in Your Windows Apps
    • Session Code - 757
  5. Maps Platform in Windows

    Slide 5 - Maps Platform in Windows

    • Bing Aerial 3D and Streetside
    • Impact of your feedback
    • Maps in Windows 10
  6. Unified User Experience

    Slide 6 - Unified User Experience

    • Windows 8.1
    • Windows 10
  7. 2D

    Slide 7 - 2D

    • HERE Location Platform
    • Maps Platform in Windows
    • One Store +One Dev Center
    • Full Support for Existing Code
    • SDK +Services
    • Adaptive User Interface
    • NaturalUser Inputs
    • Maps Platform
    • Offline
    • 3D
    • Routing
    • 2D
    • Geofence
    • Routing
    • Offline
    • 3D
    • Map Elements
    • StreetSide
    • Location
    • StreetSide
    • Map Elements
    • Location
    • Businesses
    • Transit
    • Traffic
    • New!
    • New!
    • New!
  8. Slide 8

    • HERE Location Platform
    • Maps and location APIs for Windows 10
    • Windows.Devices.Geolocation
    • Geofencing
    • Geolocator
    • Windows.Services.Maps
    • MapLocationFinder
    • MapRouteFinder
    • Windows.UI.Xaml.Controls.Maps
    • MapControl
    • XAML elements
    • MapTileSources
    • MapElements
    • 3D
    • StreetSide
    • MapRouteView
    • LaunchUriAsync
    • ms-drive-to
    • bingmaps
    • ms-walk-to
    • One Store +One Dev Center
    • Full Support for Existing Code
    • SDK +Services
    • Adaptive User Interface
    • NaturalUser Inputs
    • One service token – www.BingMapsPortal.com
    • Maps Platform
    • Offline
    • 3D
    • Routing
    • 2D
    • Geofence
    • Map Elements
    • StreetSide
    • Location
    • Businesses
    • Transit
    • Traffic
  9. MapControl Basics

    Slide 9 - MapControl Basics

    • xmlns:maps="using:Windows.UI.Xaml.Controls.Maps"
    • <Grid>
    • <maps:MapControl x:Name="myMap" />
    • </Grid>
    • ZoomLevel – 1 to 20 (max zoomed in)
    • Heading – 0 (north), 90(west), 180(south), 270(east) to 360
    • DesiredPitch – 0(top down) to 64(horizon)
  10. MapControl Basics

    Slide 10 - MapControl Basics

    • myMap.Center = new Geopoint(new BasicGeoposition
    • {
    • // Geopoint for San Francisco
    • Latitude = 37.733795,
    • Longitude = -122.446747,
    • });
    • myMap.ZoomLevel = 12;
    • Center the Map
  11. MapControl Basics

    Slide 11 - MapControl Basics

    • MapIcon mapIcon1 = new MapIcon();
    • mapIcon1.Location = myMap.Center;
    • mapIcon1.NormalizedAnchorPoint= new Point(0.5, 1.0);
    • mapIcon1.Image = RandomAccessStreamReference.CreateFromUri(new Uri("ms-appx:///Assets/MapPin.png"));
    • mapIcon1.CollisionBehaviorDesired = MapElementCollisionBehavior.RemainVisible;
    • myMap.MapElements.Add(mapIcon1);
    • Adding MapIcon
  12. MapControl Basics

    Slide 12 - MapControl Basics

    • MovieInfoPanel infoPanel = new MovieInfoPanel(); //XAML UserControl
    • movieMap.Children.Add(infoPanel);
    • MapControl.SetLocation(infoPanel, elementClicked.Location);
    • Adding XAML children
  13. URI scheme

    Slide 13 - URI scheme

    • Uri uri = new Uri("bingmaps:?rtp=adr.Mountain%20View,%20CA~adr.San%20Francisco,%20CA&amp;mode=d&amp;trfc=1");
    • await Launcher.LaunchUriAsync(uri);
    • Bingmaps:
  14. GeoLocator Basics

    Slide 14 - GeoLocator Basics

    • GeolocationAccessStatus locationAccessStatus =
    • await Geolocator.RequestAccessAsync();
    • if (locationAccessStatus == GeolocationAccessStatus.Allowed)
    • {
    • Geolocator geolocator = new Geolocator(); geolocator.DesiredAccuracy = PositionAccuracy.High;
    • Geoposition userPosition = await geolocator.GetGeopositionAsync();
    • }
    • Request access and Geoposition
    • <DeviceCapability Name="location"/>
  15. Location consent

    Slide 15 - Location consent

    • System provided in-app prompt
    • System provided per-app On/Off toggle
    • Actions for you:
    • Remove your custom prompts/toggles
    • Use Geolocator.RequestAccessAsync()
    • URI to send your users to location settings
  16. Heading/Zoom/Pitch/MapControl 101

    Slide 16 - Heading/Zoom/Pitch/MapControl 101

    • Demo: Maps 101
  17. Demo: MovieSpots

    Slide 17 - Demo: MovieSpots

  18. Slide 18

    • Globe projection
    • Worldwide Digital Elevation Data + Satellite Imagery
    • 3D Cities
    • Bing Aerial 3D
    • B
  19. A huge 3D environment…

    Slide 19 - A huge 3D environment…

    • Over 75,000 sq km
  20. Demo: Visualizing Data in 3D

    Slide 20 - Demo: Visualizing Data in 3D

  21. The 3D world makes you think in 3 dimensions!

    Slide 21 - The 3D world makes you think in 3 dimensions!

  22. Camera Behavior with 2D Mercator Tiles

    Slide 22 - Camera Behavior with 2D Mercator Tiles

    • Nadir Camera
    • Camera Lat/Long equal to Look-at
    • Mercator Projection
    • Visible Extent always a nice box
    • Center of box = lat/long of look-at
  23. Camera Degrees of Freedom in 3D

    Slide 23 - Camera Degrees of Freedom in 3D

    • Look-At Point on the Earth
    • Camera
    • Camera Lat/Long not equal to look-at
    • Elevation of look-at important
    • Visible Extent an irregular shape which can be quite large
    • “Center” of view difficult to determine
  24. Elevation Models

    Slide 24 - Elevation Models

    • Ellipsoid
    • Geoid
    • Terrain
    • Surface
  25. Slide 25

    • Camera: The perspective the map is looking from.
    • Scene: A representation of the thing you want to look at. Created from MapScene static factory methods.
    • You create the scene, we’ll figure out the best camera an animation to it // show the Golden Gate Bridge and 300 meters around it
    • map.TrySetSceneAsync(MapScene.OfLocation(goldenGateGeopoint, 300));
    • We’ve added APIs to make 3D easy
    • Camera
    • (Looking From)
    • Scene (Looking At)
  26. Demo: Using Scenes and Cameras

    Slide 26 - Demo: Using Scenes and Cameras

  27. Slide 27

    • Go beyond the map!
    • Expanding across the world:
    • 55mp pixels taken every 4 meters
    • Gathering petabytes of imagery
    • Bing Streetside
  28. Slide 28

    • To creating a Streetside view inside the map control:
    • 1. Find if there is a nearby Streetside panorama
    • Working with Streetside Imagery
    • if (panorama != null) {
    • map.CustomExperience =
    • new StreetsideExperience(panorama, 60, 90, 60);
    • }
    • StreetsidePanorama panorama = await StreetsidePanorama.FindNearbyAsync(goldenGateGeopoint, 100);
    • 2. Instantiate the StreetsideExperience using your StreetsidePanorama
  29. Demo: Using Streetside

    Slide 29 - Demo: Using Streetside

  30. Slide 30

    • URI Schemes - Launcher.LaunchUriAsync()
    • MapElements and XAML on Map
    • GeoLocation
    • <DeviceCapability Name="location"/>
    • Geolocator.RequestAccessAsync()
    • Is3DSupported/IsStreetsideSupported
    • Map tips and tricks
  31. Offline maps on desktop/tablets

    Slide 31 - Offline maps on desktop/tablets

    • Performance
    • MapElement
    • MapIcon visibility and ZIndex
    • MapElementClick, MapElementPointerEntered/Exited
    • BusinessLandmarksVisible/TransitFeaturesVisible
    • Common controls - zoom, scale, tilt, rotate
    • Windows platform developer UserVoice site –
    • https://wpdev.uservoice.com/forums/110705-dev-platform
    • Impact of developer feedback
  32. Explore the Windows Maps App built using the Maps Platform

    Slide 32 - Explore the Windows Maps App built using the Maps Platform

    • Take the Maps Quick Start challenge
    • Attend Session 645
    • Visualizing Business Data on any Device with Bing Maps
    • Friday - 12:30 – 1:30 by Ricky Brunditt
    • Check out Session 626
    • Earlier today by Shawn Henry and John Vintzel
    • App Lifecycle: From Activation and Suspension to Background Execution and Multitasking in Universal Windows Apps
    • Meet us in the Windows Insiders lounge area
    • Build wonderful apps using Maps and location in Universal Windows Platform!
    • Recommended for you…
  33. //build/ 2015 demo code –

    Slide 33 - //build/ 2015 demo code –

    • https://github.com/thakkar/MapsUWPDemo
    • Map101 sample – https://github.com/Microsoft/Windows-universal-samples/tree/master/mapcontrolsample
    • Geolocation 101 sample – https://github.com/Microsoft/Windows-universal-samples/tree/master/geolocation
    • LaunchURI bingmaps documentation - https://msdn.microsoft.com/en-us/library/windows/apps/xaml/jj635237.aspx
    • How to authenticate a Map App - https://msdn.microsoft.com/en-us/library/windows/apps/xaml/dn741528.aspx
    • //build/ 2014 demo code upgraded to Windows 10 – https://github.com/thakkar/MapsBuild2014Sample
    • //build/ 2014 talk –
    • http://channel9.msdn.com/Events/Build/2014/2-526
    • Windows platform developer UserVoice site –
    • https://wpdev.uservoice.com/forums/110705-dev-platform
    • Twitter contact – @thakkarrohan and @mikeamm
    • Resources
  34. Q & A

    Slide 34 - Q & A

  35. Q & A

    Slide 35 - Q & A

  36. Q & A

    Slide 36 - Q & A

  37. Q & A

    Slide 37 - Q & A