How to: Use the BingMapDataProvider

• Sep 03, 2018

This lesson demonstrates how to create a simple map application which connects to the Bing Maps data provider.

Note

A complete sample project is available at: https://github.com/DevExpress-Examples/getting-started-lesson-1-connecting-a-map-control-to-ms-bing-e4321

XAML

<Page

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:BingMapsLesson"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:Map="using:DevExpress.UI.Xaml.Map"
    x:Class="BingMapsLesson.MainPage"
    mc:Ignorable="d">

    <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
        <Map:MapControl ZoomLevel="3" >
            <Map:MapControl.Layers>
                <Map:ImageTilesLayer>
                    <Map:ImageTilesLayer.DataProvider>
                        <Map:BingMapDataProvider Kind="Area" 
                             BingKey="YOUR BING MAPS KEY" />
                    </Map:ImageTilesLayer.DataProvider>
                </Map:ImageTilesLayer>
            </Map:MapControl.Layers>
        </Map:MapControl>
    </Grid>
</Page>

XAML

<Page
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:BingMapsLesson"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:Map="using:DevExpress.UI.Xaml.Map"
    x:Class="BingMapsLesson.MainPage"
    mc:Ignorable="d">

    <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">

        <Map:MapControl ZoomLevel="3" >
            <Map:MapControl.Layers>
                <Map:ImageTilesLayer>
                    <Map:ImageTilesLayer.DataProvider>
                        <Map:BingMapDataProvider Kind="Area" 
                             BingKey="YOUR BING MAPS KEY" />
                    </Map:ImageTilesLayer.DataProvider>
                </Map:ImageTilesLayer>
            </Map:MapControl.Layers>
        </Map:MapControl>


    </Grid>
</Page>

Note

If you run the application and see a window with the following error message: “Access was denied. You may have entered your credentials incorrectly, or you might not have access to the requested resource or operation.”, refer to the following tutorial: How to: Get a Bing Maps Key.