Today the Bing team announced the release of their WinRT Bing Maps control (BETA) for XAML applications. First the goods:
- Read their announcement here: Bing Maps for Metro style apps
- Download the bits: Bing Maps SDK for Metro style apps (VSIX)
- Read the reference API docs: Bing Maps SDK
If you are familiar with the Silverlight control, it is similar in nature to how you would use it in your XAML Metro style app. Here’s some helpful tips that are in the docs but just wanted to elevate them because we have a tendency not to read docs :-).
Installing is simple for Visual Studio. Download the VSIX file and double-click it. If you have both Express and Ultimate installed it will prompt you to install it for both installations. That’s it…you are done. If you had VS running while you did this, it would be a good idea to restart VS.
Creating a .NET XAML application with maps
Once you restart VS, you can create a new C# Metro style application. Once you have this, just right click on the project and choose Add Reference and then navigate to the Windows\Extensions section and you will see Bing Maps:
When you do this you will also want to add a reference to the VCLibs Extension at this time. Why? Well, the Map control is a native control. Adding the VCLibs dependency at this time will add the necessary information in your app’s package manifest noting the dependency and it will install any required package dependencies from the store when your user’s install it.
If you compile your application immediately you will notice an exception during build:
This is because by default the managed applications are “AnyCPU” configuration and the native control doesn’t have that configuration. Change your app to be either x86 or amd64 and your build will succeed. This means that yes, you will want to create multiple architecture-specific packages for your app. The good thing is during package creation, the tools in Visual Studio make this easy for you.
Creating a C++ XAML application with maps
For C++ the step is to just reference the Bing Maps extension SDK and you are done. C++ projects are always architecture-specific so you don’t have the AnyCPU situation here.
Using the Map control
You’ll need to get set up with an API key, which the getting started docs inform you about. Once you have that you are ready to use the control. I’m a fan of putting the API key in my App.xaml as a resource:
And then in my Map control I can just refer to it:
Once I have those pieces in place, I’m done and can run my app and get full map interactivity. Notice the xmlns declaration in my Page with the “using:Bing.Maps” notation. Now when I run:
I can quickly add location to my app by setting the capability in the Package.appxmanifest and then wiring up the map to center on my current location…
I’m excited about what the Bing team has done here and you should go grab it, read the docs and start incorporating location visualization into your Metro style XAML apps today!
Hope this helps!