http://www.econguru.com/heat-map-of-worldwide-gdp-ppp-per-capita-2008/
This is CIA world Factbook map, each country has different color depth based on their GDP number. High GDP country has deeper color.
Right now, I am considering to develop such effect into my iPhone/iPad map app. I may want to use the apple map (probably not google map since iOS 6 has its own map), but I am not sure how to get such effect based on the country the user visited.
For example, the user visited US the most, then the map shows deeper color in US.
I haven't seen such effect in iPhone app yet. Any suggestion would be appreciated!
This should be doable using MapKit and overlays. You would need to construct an overlay for each area of the heat map and then set the color according to the data. I suspect the hardest part is going to be getting the geographic data you need to construct the paths for each region. AFAICT, there's no -pathForState: or -pathForCountry: type of functions in MapKit, so you're going to need to find another source for that information. But in terms of drawing overlays, it's all there in MapKit. Check out this sample code.
EDIT:
This question has some pointers on where to get that data.
You can get the coordinates ready to go in json format from the D3 project on github:
https://github.com/latentflip/d3/blob/master/data/world-countries.json
You can download this json, use NSJsonSerialization with the file to load the json into a Dictionary or an array, and then build your overlays from there.
One other thing: you aren't technically after a heat map; what you're afer is more of a "thematic" map.
Try the LFHeatMap class. Seems to be what you're looking for.
https://github.com/gpolak/LFHeatMap
Related
I'm using Mapbox GL JS. Is there any way I can style my base layer to look like the Mapbox Light example, but showing only the UK?
I assume I would use Mapbox Studio to build my own base layer, but I can't see any way in Studio to filter by country.
If that's not possible, is there any way I could show labels on the UK only, and show other countries as filled polygons? (As per this unanswered question.)
Unfortunately it is not possible to filter by a certain geography when selecting the data source for a layer. If you're working with Mapbox's tiles, they'll always cover the entire planet.
There is the possibility to restrict the map to a certain (rectangular) bounds, with the map.setMaxBounds method (https://www.mapbox.com/mapbox-gl-js/api/#Map#setMaxBounds). This might work reasonably well since you want to restrict the view to the UK, but might not be suitable depending on the geometry you want to restrict the view to.
As a workaround you could create a dataset and add a polygon that covers the entire planet except for the extent you want to show in your map. Then add this dataset in your style as the top most layer and style it with whatever you'd like the empty space in your map to look like.
The workaround has been also suggested in this SO answer, if you can get maptiles for the UK only (the SO answer gives a link, but for Germany) you can
upload them to Mapbox as a dataset, export it to tilesets, and then
to a map as a layer. Delete all other layers
You have also the possibility to Style a single country in Mapbox
studio ref this tutorial. The other countries are still shown, but you can style your map in a way to highlight UK
There is a option that allows you to show only one country highlighted. But drawback is, you lose all the layers and tile-level details. Here is the link https://www.mapbox.com/videos/how-to/map-a-single-country-in-mapbox-studio/.
But if you want to include the tile details as well as whole world map but in that map only one or two or custom amount of countries highlighted, then, from above link of Natural Earth download the zipped file of ne_10m_admin_0_countries and upload.
Go back to your map style, and instead of making a blank one. Add another layer of ne_10m_admin_0_countries in your current map. Select the country in the filter option (in same way as shown in video). And change its opacity. That's it.
Hope it helps. Have a great day.
I'm interested in custom map tiles, and using advice from here and here, I've experimented with exactly that. For a prototype I did a very geeky map of the Star Trek Federation, with episode links moving you around the planets/systems etc.
While that's all fine and dandy for fantastical locations, I'd also be interested in using heavily stylised renditions of real world locations, yet still using real lat,lng points. So, for example, a bespoke, yet mostly geo accurate, map of London, chopped into tiles, but if you passed in lat,lng coords for Camden Tube (51.53911 -0.14235), you would move to that location.
Any ideas how you configure LeafletJS to do this, without going the route of using Google Maps with custom tiles?
If I understand correctly, you have 2 different applications:
Your Star Trek map, for which you are satisfied.
Stylised map of real world, for which you would like real lat,lng coordinates to be accurate?
Then your question is how to create your custom tiles, so that Leaflet shows the stylised view of London when passed the real London coordinates?
In that case, it would be probably just a matter of correctly numbering your tiles. Or the reverse, modifying the tile numbers used by Leaflet to build the tiles URL. For the latter solution, see Specifying Lat & Long for Leaflet TileLayer
I'm not quite sure what you mean by "mostly geo accurate". It sounds like you probably just want to generate your own map tiles from some kind of source like OpenStreetMap. In that case, TileMill (although kind of obsolete) is probably the easiest way to go.
There are basically three parts:
Generate some map tiles (eg TileMill)
Host them (eg TileStream)
Point Leaflet at them
I understand it's not ideal to change mapkit colors but specifically for a location based game I'm creating I'd like to have to colors much less dramatic and more dark. Is there a built in way that I can accomplish this? Since the game won't be specific to a certain region custom overlays wouldn't really work. I know with the old google maps the only way to do so was to create a javascript version of the map and add it in a webview (not ideal for the game) but with this new apple maps is there a way to redraw the shapes of these elements (parks, water, building) with a different color.
I don't have a complete understanding how the previous or current mapkits work from the ground up so if I'm missing any information or am confusing I apologize.
No there is no way you can do that in the current iOS6 maps.
The MapKit Reference does not have any inbuilt functions to do that.
I would seriously ask you to reconsider changing colors of the current MapKit even if you could do it through some other hack. You might get rejected from the App Store.
You have 2 options
a. Instead use your own maps from other vendors if you want to change colors and so for different places.
b. Overlays are a good way to go too but they are heavy work on REST side of downloading maps. I am currently using this in my map right now because all my map tiles are generated on the fly and I do not have to do too intensive work on the iPhone.
I am creating an iPhone app for OS4.0, and I am attempting to integrate a custom map with a standard MKMapView. I have been provided a map in .eps format (vector image), and I want to somehow overlay this on an MKMapView in and restrict the scrolling boundaries of the map so users cannot scroll outside the boundaries of the custom map. What's the best way to go about this?
I have read some stuff about hosting map tiles on a server, but this seems overly complex for my application. This would just be a map for an attraction roughly the size of a public zoo, so I would think that it would be conceivable to just convert the .eps to a .png file, and overlay it, but this might not give the best performance.
I understand that I could conceivable use a UIScrollView to do the job, but the problem is that I have dynamically generated MKPinAnnotationViews placed on the map, whose position must be based on latitude and longitude, so I can't think on an elegant or reasonable way to do it with a scrollview. Any ideas?
Thanks!
-Matt
Apple has a great bit of example code that will show you what you need to do. Check out the TileMap sample - it is available as part of the (free) WWDC 2010 samples download.
It shows you how to use the gdal2tiles utility to convert an input map into a tree of overlay tiles.
Another good bit of Apple sample code to check out is HazardMap, which is part of the regular SDK samples.
Really hope someone can help me as I'm a bit stuck :S
I have a custom map of an event using the CATiledLayer so users can zoom in and scroll around the map. What I would like to do now is add the functionality to let the user know where they currently are on the map. I know it can be done as I've seen an app do this before. I'm not sure how to go about doing it though, maybe I need to convert lat/lon into pixels but I'm not sure if thats possible (depending on how big the image is, etc).
On another site it was mentioned to find out the boundaries of the map and then I can add pins to the map, but I'm not sure how to go about doing this? Will I need to find every coordinate (lat/lon) within the boundary so I can add the pin of where the user is currently?
If anyone can give me with any advice or pointers, I'd much appreciate it
You can use the route-me library by adding your own map source class. A good article that explains how to do it is here http://mobilegeo.wordpress.com/2010/07/07/route-me-native-iphone-mapping-framework/
I'm facing a challenge right now in trying to map GPS coords to a map that's an artist's rendition. In particular this is for a ski mountain, so the artist's rendition is a "trail map". The trail map is not accurate in that the whole mountain has been squeezed onto the one view, yet the actual topology of the mountain doesn't conform to the drawing.
I've tried several approaches:
1) Triangulation using known GPS coordinates of the lift stations. This is fairly simple to implement, yet this is not accurate enough and the algorithm fails if the rendition differs enough from the GPS map.
2) Creating a uniform grid for both the GPS map and the Trailmap, then doing a mapping from cells in the GPS map to the Trailmap. The downside to this is it can be a lot of busy work with no easy UI for doing it.
3) Calculating the vectors of each lift (being a straight line), find the closet lift station to a given GPS point, and calculate the estimated Trailmap location using this vector.
I'm considering #2, which is essentially the simplest solution. But if you've found a better way, I'd love to hear it.