I am working on an app for the Windows Store that requires mapping functionality. As it is a Windows app, it seems logical to use Bing Maps as they also provide an SDK for apps. Currently it is at version 8, but I had a few problems implementing that version so went for version 7 with the hope to upgrade it at some point when I get more traction for the app.
Firstly you need to go to the Bing Maps Developer portal and sign in to request an API key for your project.
Some transactions with the Bing Maps API are billable, but you have to exceed a limit of 50,000 transactions in any 24 hour period, a listing of billable transactions can be found here. The reason I am mentioning this is in case you are offering a free app and a large number of users start to hit the service you could be liable to paying out.
To get the SDK for V7, you need to go to the Visual Studio Marketplace and download the Bing Maps SDK for Windows 8.1 Store apps.
This will give you a VSIX to install into Visual Studio.
This will give you a basic template with enough functionality to test out the mapping API.
Choose the Target versions to support (Build 10586 should suffice)
It will highlight a compatibility warning linking to https://go.microsoft.com/fwlink/?LinkID=309181 as it is really should be used with Windows 8.1 apps.
So now when we expand the References in our app we can see the required files for the mapping functionality we are going to build with.
I like to structure my apps, so that the main entry view (index.html and main.js) do a check on load and change the view depending on screen size/device etc. So I create a home view which has the ready, unload and updateLayout functionality. This home view is then loaded from the main entry view and inserted into a content host element.
We now need to add the script references and an element for the map in the home.html file:-
The CSP is important because it defines which urls are safe to load from. The div with the id webview is where our map will go.
Then in the home.js file add this
There you go, our simple map in the app.
There is so much more functionality that can ne added to this app such as getting the geolocation of the user and adding pushpins to different locations, but I will leave that for another post.