HelloEarth is looking good, but it’s still a bit plain. Almost all map or globe apps have some sort of overlay which adds additional information or context. Let’s add some country outlines to get a taste of what’s involved when adding vector data in WhirlyGlobe-Maply.
This tutorial depends on at least the local image layer tutorial. Go ahead and open your HelloEarth project.
If you haven’t got one here is a suitable ViewController (for Objective-C or Swift) file to start with. This version is from the previous tutorial for a remote image layer.
We need some vector data to overlay on the globe. Conveniently, you’ve already got some. Go to the resources directory from earlier. Look for vectors/country_json_50m. That’s a directory full of country outlines from the Natural Earth Data project.
You can drag all of these .geojson files into your project or just your favorites. They’re organized by country code. What, you don’t know your ISO country codes? Fine, drag them all in. Be sure you’re adding them to the HelloEarth target so they get copied to the bundle.
Great, we’ve got files. Now let’s do something with them.
Add the Vectors
Here’s how you add those vectors to the display. Open ViewController and add a private method. In Objective-C, this is done in the ViewController.m, modifying the @interface section. In Swift it’s just a method with private modifier.
The WG-Maply toolkit likes to specify many of its arguments as an NSDictionary (or Dictionary in Swift). So let’s add a private dictionary member, to set our default vector characteristics.
Next, add some code to set the vector properties and call the addCountries method at the end of viewDidLoad.
Finally, fill in the addCountries method itself after viewDidLoad.
Build and run the app. You should see the outlines of the countries you included in HelloEarth.
Neat! That’s the country outlines right on top of the globe with its base layer. But there’s a lot going on here so let’s unpack it.
Breaking it Down
First up, let’s look at the dispatch_async() call. That’s an asychronous request to run a block of code in another thread.
WhirlyGlobe-Maply is very thread safe and very threaded. For the user, this means you can call all the add methods from other threads and you probably should. Whenever you’ve got a bunch of work to do, like loading all these files, do it on another thread.
The code block itself is pretty simple. We’re doing the following.
Figuring out which geojson files are in the device bundle.
Loading them in, one by one
Converting them from GeoJSON to a MaplyVectorObject to MaplyBaseViewController.
The view controller returns a MaplyComponentObject. If you ever want to remove or modify these, you’ll need that object.
You might notice we’re pulling a string called “ADMIN” out of each vector. This will be handly later if we want to know which country it was.