[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Showing posts with label MapBox. Show all posts
Showing posts with label MapBox. Show all posts

Tuesday, March 08, 2016

Mapping China's Changing Coastline


In China the Yellow River carries 1.4 billion tons of silt to the Bohai Sea every year. One result of all this silt is that the Yellow River Delta continually grows and shrinks over time.

Mapbox has used satellite imagery from NASA and USGS’s Landsat program to dramatically visualize this change in the Yellow River Delta since 1979. The map shows how the Delta has grown and shrunk over the last sixteen years.

In 1996 the main channel into the sea was blocked by Chinese engineers, forcing the river to the northeast. In the first images of Mapbox's China's Changing Coastline map the tip of the delta, at the end of the old channel, has retreated from erosion of the silt deposits. If you press play on the map you can see how a new Yellow River Delta grows out from the new channel of the Yellow River as billions of tons of silt are deposited from the river at the mouth of the new channel.

Tuesday, February 09, 2016

Oblique Satellite Views of San Francisco


Back in December The Atlantic released a really interesting map containing an oblique satellite view of Denver and the Colorado Rockies. The map used a rare satellite image captured by WorldView-3 to provide an alternative to the usual top down satellite views provided on interactive maps.

Mapbox has now created a similar oblique satellite view map, this time of San Francisco. The satellite image (also provided by WorldView-3) is simply amazing. The Mapbox blog explains how the camera on board WorldView-3 includes a sensor suite called CAVIS, which is able to filter out atmospheric haze which can partly obscure the Earth in oblique satellite views.

The Mapbox blog also contains a number of zoomed-in versions of the map highlighting some of the areas in San Francisco captured by WorldView-3 in this satellite image.

Wednesday, July 08, 2015

The Berlin Building Size Map


Last week the Berliner Morgenpost published a wonderful interactive map of Where the Population of Europe is Growing – and Where it’s Declining. Now one of the map's creators has written a nice tutorial explaining How to Create an Interactive Map with 100k+ Areas.

One of many impressive accomplishments in the European population map was that it contained 119.406 interactive colored polygons, each of which could be selected on the map to view details on the area's population change. The tutorial explains how you can create a map with a similar number of interactive polygons.

The tutorial explains how you can use Tilemill to style your data (once the data had been merged with a shapefile).  It then explains how you can then use Mapbox to create an interactive map from the styled map tiles.

The demo map that is created in the tutorial is pretty interesting itself. The map colors building footprints in Berlin by the number of floors in each building. The result is a map of Berlin which shows you where the tallest buildings in the city are concentrated.

Wednesday, March 25, 2015

80 Million Bolts of Lightning


A Month of Lightning is an interactive map of all 80,305,421 lightning strikes that occurred across the globe in May 2013.

Mapping 80 million data points on a digital map is not an easy task. However when Mapbox's Eric Fischer created the Most Detailed Tweet Map Ever he also built & released an open sourced tool called Tippercanoe for making vector tiles from large data sets.

Jordan Rousseau was able to use Tippercanoe to process the May 2013 lightning data from Weather Decision Technologies. The result is this impressive Mapbox map which allows you to view over 80 million global lightning strikes from just one month.

You can read more about how the map was made in Jordan's blog post, Visualizing a Month of Lightning.


If you want to see where lightning is striking right now then you can also check out these two real-time lightning maps.

LighteningMaps is a live Google Map of lightning strikes across the globe. Animated flashing circles light-up on the map to record each lightning strike so it is easy to see where in the world electrical storms are occurring right now.


Blitzortung.org works with a community of users, who have built their own lightning receivers, to automatically display live lightning data on a Google Map.

Blitzortung.org includes instructions on how you can build your own lightning monitor and also includes instructions on how you can build your own Google Map based on the data received from a lightning monitor.

If you can't be bothered to build your own lightning box you can always just check out Blitzortung's live Google Map of lightning strikes.

Thursday, March 19, 2015

Mapping Sunlight


This interactive map, from Dumpark, reveals the average number of hours of direct sunlight received each day throughout Wellington City in New Zealand.

The number of hours of direct sunlight is affected by topographical features, such as hills, and physical objects, such as buildings and trees. To measure the number of hours of direct sunlight Dunpark used data elevation models of Wellington City combined with building footprint data of the city.

The Hours of Direct Sunlight map shows the yearly average number of hours of direct sunlight received each day. It is also possible to view layers showing the average number of hours received in the mornings and in the afternoons.

Saturday, March 07, 2015

CSS Transform Your Maps


Three years ago Bonne Voy used CSS transform and jQuery to create an impressive folded map effect to a Google Map. Folded Google Maps animates the unfolding of the Google Map as if it was a paper map. It also uses the CSS transform to apply a tilted effect to the map.


In a recent demo map Mapbox also used CSS transform to visualize 3d elevation profiles on bike routes between Washington DC's Capital Bikeshare docking stations. CSS transform is used to tilt the map to give a more oblique view. The result is that the 3d elevation profile of the route really pops out from the underlying map.


Peter Liu has now written a Mapbox blog post explaining how you can use CSS transforms to create a similar tilt effect on your own maps. In Add a Third Dimension to Mapbox.js with CSS Peter walks you through how to apply the CSS transform styles to tilt and rotate a Mapbox map. He also explains how you can apply CSS transform to the map markers to help make then stand out on a tilted map view.

The post is accompanied by a nice Mapbox map demonstrating the effects discussed in the post. Because these effects are all created with CSS they are not specific to the Mapbox mapping library. You can of course use the same CSS transform styles to create a tilt effect on a Leaflet or Google Map.

Friday, February 27, 2015

Visualizing Ten Years of OpenStreetMap


Mapbox has released an animated map visualizing the growth of OpenStreetMap data over the ten years since the project started. Ten Years of OpenStreetMap shows how OpenStreetMap has grown in ten years from a map of a few London streets to one of the most detailed maps of the world.

The animated map reveals how OpenStreetMap has particularly developed in the last 5 years from largely a map of the United States and Europe into a truly global map.


Martin Raifer's OpenStreetMap Node Density also provides a general overview of OpenStreetMap's global coverage. Each pixel on the map shows the number of nodes at that location. Martin Raifer's map shows OpenStreetMap node density as of June 2014.


Of course OpenStreetMap is an ongoing project to map the world. The world is always changing and OpenStreetMap needs to reflect those changes. Therefore dedicated volunteers around the world are always working to improve the map.

OSMlab's Show Me The Way provides a real-time view of OpenStreetMap's contributors in action. Using satellite imagery from Bing Maps 'Show Me The Way' provides a captivating visualization of the ever improving OpenStreetMap project.

Thursday, February 12, 2015

Mapping the Alaskan Sled Race


The Mapbox Blog is continuing to showcase maps built using Turf.js. The latest demonstration of the geospatial processing abilities of Turf is an animated map of the Iditarod, an annual sled dog race which takes place  inAlaska.

Time Travel Across the Iditarod with Turf replays the whole race, allowing you to follow the progress of each of the dog sleds over the course of the 15 day race. As the map plays out you can click on any of the moving map markers to view the driver of the selected sled. You can also select any of the riders from the map sidebar.

Another neat aspect of this map is that during the night-time hours of the race the map tiles fade darker and then fade to lighter tiles for the daylight hours.

If you want to try out Turf.js check-out the API documentation, which has recently been updated with example code and maps.

Wednesday, February 11, 2015

Mapping New York's Citibike Data


There are a lot of mapped visualizations of data taken from bike sharing networks around the world. Not many are as good as the Citibike Dashboard.

The Citibike Dashboard map displays rides on New York City's public bike share system for July 17, 2014, the network's busiest day to date. What is really special about this Mapbox based visualization is the the control it gives the user to filter the data displayed on the map.

Using the controls in the right-hand panel you can filter the rides visualized on the map by age-range, ride direction and ride duration. The dashboard above the map shows the average age, ride duration and the male to female ratio. When you filter the data the dashboard automatically updates to reflect the new data displayed on the map.

The time-line beneath the map can also be used to filter the data on the map by time range. The time-line reveals that the busiest times on the Citibike network are during commuting hours. If you adjust the time range using the time-line control the dashboard again automatically updates to reflect the new results displayed on the map.

The data filtering is powered by the Crossfilter library.

Thursday, February 05, 2015

The Land Rover Drivers Map


When it comes to map based promotional campaigns most car manufacturers opt for a stylish Street View based interactive game. For example, see the car campaigns featured in this post on The Top 5 Street View Car Ads.

For their latest promotional campaign Land Rover has instead chosen to create a social sharing campaign centered around a Mapbox generated satellite map. Well Storied invites Land Rover drivers to share their Land Rover adventures and photos with the rest of the world.

The campaign encourages Land Rover drivers to promote the brand on social media by posting stories, videos and photographs to Twitter, Google+, Tumblr, Facebook or Instagram. The reward for promoting the brand is that the post caould be added to the Well Storied map.

To see more mapped based promotional campaigns check out the promotional tag on Maps Mania.

Monday, January 26, 2015

Mapping Traffic Density


Mapbox has created a map visualizing the latest Highway Performance Monitoring System national highway dataset. The Open US Highway Dataset Map shows all the HPMS traffic density measurements for US roads.


Roads on the map with traffic density data are colored yellow. The thickness of the yellow linea on the map relate to the amount of traffic. Thick lines indicate more traffic and thinner lines less traffic. Zoom in on the map and you can view the average number of vehicles per day for different sections of roads.

Saturday, January 24, 2015

Dynamic Driving Directions with Turf


Turf is now available as a Mapbox.js plugin and can be used to perform many common GIS operations. Over the last few weeks the Mapbox blog has been posting a number of interesting examples of how Turf can be used with the Mapbox platform:

Dynamic walkability estimation with Turf
Find your nearest cup of coffee with Turf
Turf for local gov: potholes and parking meters
Analyzing 60 years of tornadoes with Turf

The posts on the Mapbox blog provide a number of useful use cases of how Turf can be deployed with Mapbox and provide some useful tips for anyone who is looking to develop a Mapbox based map using the Turf plug-in.


On Thursday Mapbox posted a very nice example of using Turf with Mapbox driving directions. Keep on truckin' with Turf.js and Mapbox Directions animates a marker along a route from San Francisco to Oakland.

As the marker follows the driving route all the nearby electric vehicle charging stations are automatically added to the map using Turf's .distance() method. You can test how fast Turf can process data on the fly by dragging the start and end destination markers on the map to create a new route. Change the route and you can see how the nearby electric vehicle charging stations are updated instantly on the map.

As the animated marker follows a route you can also select any of the charging station markers on the map. The route is then automatically updated to take in a stop at the selected charging station.

Monday, January 19, 2015

All the Roads in Japan


Mapbox has released a gorgeous map of all the roads in Japan. OpenStreetMap in Japan only shows roads and streets and omits all over map features.

The roads on the map are colored by the last date that they were edited on OpenStreetMap. Roads colored blue haven't been edited since 2007. The yellow roads have been edited in the past year. The Mapbox post on the map includes a link to a full-screen map. The map embedded in the post however includes a button to quickly toggle to view close-ups of major cities on the map.


If you like the Japanese road map you might also like Andrew Hill's map of United States rivers. This map shows all United States rivers colored by the direction of flow. The U.S. Rivers Colored by the Direction they Flow map only shows the colored river locations on a black background to create a visually striking map of the United States.


Railroads: A Staple in World Growth is a neat interactive map showing only all the world's railway lines and no other features. There are enough railway lines around the globe for a recognizable map of the world to appear.

Looking at the emergent map the former eastern bloc countries in Eastern Europe seem to have the densest concentration of railway lines. The map also clearly shows, via the absence of railway lines, some of the world's last remaining great undeveloped areas, such as the Brazilian rain forest, the Saharan Desert and the Australian Outback.


Using the Google Maps API's Styled Maps feature it is possible to create a similar map showing only the world's roads. When Google first released the option to style maps I created this World Road Map.

Unfortunately when you zoom out Google Maps does not show roads, so at the lowest zoom levels you get a blank map. However the advantage of Google Maps showing different details at different zoom levels is that more roads appear as you zoom in on the map. At lower zoom levels you only see highways and major roads on the map but, as you zoom in, you begin to see the whole road network appear.

Mapping Global Corruption


The most corrupt countries in the world are Somalia and North Korea, according to Transparency International.

The Corruption Perceptions Index measures perceived levels of public sector corruption across the world. The CPI is calculated using data collected "by a variety of reputable institutions". You can view the full list of the data sources via a link on the Transparency International FAQ page.

Transparency International has released a Mapbox created interactive map to visualize the CPI rank and score of all 175 countries and territories included in the index. If you select a country on the map you can view its 2014 corruption score and rank and compare these to its 2013 CPI score.

Of the 175 countries included in the index Denmark is the country which is perceived as having the least corrupt public sector in the world.

Tuesday, January 06, 2015

Water Solutions for the Ecuadorian Amazon


Digital Democracy's ClearWater is a great story map exploring the organisation's work in providing clean water solutions for indigenous communities in the Ecuadorian Amazon.

The ClearWater Project is an indigenous-led effort to bring clean water to thousands of people suffering from water contaminated by oil drilling in Ecuador’s northern Amazon region. As you progress through the ClearWater story map you can learn about how rainwater catchment systems have been developed in different Ecuadorian communities.

The map introduces you to some of the people and communities involved in the project, the training of community technicians and the numbers of people who have benefited from the organization's work.

The ClearWater project map is a nicely designed map. A story map really is an engaging and informative way for the charity to explain and demonstrate their work in the Ecuadorian Amazon.

Thursday, December 04, 2014

The 6 Billion Tweets Maps


Eric Fischer at Mapbox has mapped 6 billion geo-tagged Twitter messages. The 6 Billion Tweets Map is a great visualization of Twitter's global appeal, showing where Twitter is popular and also where in the world the social network has yet to gain traction.

Mapping 6 billion Tweets is also quite a technical achievement. If you are interested in how Eric was able to manage mapping so much data on one map then you should read his Mapbox blog post on how he created the map. In particular you might be interested in a new tool which Eric has developed for making vector tiles from large data sets, called Tippecanoe.


For me one of the most interesting things that the map reveals is that Twitter can't handle Tweets posted along the Prime meridian. A blank band runs vertically down the map along the meridian, so it looks like Twitter's geo-location tools can't handle Tweets with a longitude of 0°.

Wednesday, November 26, 2014

How to Make a Rent Map


Last year the Financial Times created a nice interactive map visualizing the cost of renting in London. The London Renting Crisis map allows Londoners to view a heat map of where they can afford to rent in the capital based on their annual salary.

The map includes a slide control which allows you to adjust the annual salary level. As you adjust the salary the map automatically updates to show where you can and can't afford to rent a room in a London flat.


The Berliner Morgenpost has now released the source code of a similar map for Berlin. Titel der Anwendung recreates the rent map of London but for Berlin, using the Leaflet mapping platform.

The Berlin map uses random data as it is just a demo of an interactive heat map using Leaflet and TopoJSON. The source code for the map is available on GitHub on an MIT license. You can therefore use the Berliner Morgenpost's map library to create your own adjustable heat map for anywhere in the world, using your own TopoJSON for the shaded polygon areas.

Tuesday, November 25, 2014

The Rand McNally Trip Planner


Rand McNally Trip Maker is a new interactive road trip planning tool. Using the map you can get turn-by-turn driving directions for your trip with the option to find interesting places to visit along the route.

To create a road trip with Trip Maker you just need to enter a starting location and your destination. You can add extra stops to your trip simply by selecting the 'Add Stop' button. Your new stop will then be added to your to a trip automatically, in the location that best minimizes your total driving distance.

You can adjust the route of your trip simply by dragging the route line around on the map. If you want to add a waypoint to a route you can therefore just drag and drop the line on your desired location and the the route will automatically update.

If you want to make some pit-stops along your route you can use the 'Search on My Way' option. This allows you to search for rest-stops and points of interest along your route. You can even define how far you are prepared to deviate from your route for interesting places to visit by entering the number of miles.

When you are happy with your planned road trip you can email and export your trips to any Rand McNally GPS device.

Monday, November 24, 2014

Super Mario World


If you've ever wondered how Mario and Luigi manage to navigate so effortlessly around the Mushroom Kingdom and Dinosaur Land then you need to check out this Super Mario map from Duncan Graham. This interactive map reimagines the world as an 8-bit map in the style of Nintendo's classic game, complete with golden coins and mushrooms.

Accompanying the map is a great 'how-to' guide on how the map was created with Mapbox Studio. It's worth reading the article if you want to learn about importing land or water source files into Mapbox Studio, how to add custom elements to your map and how to order layers.


If vintage computer games don't float your boat then you might prefer this Dot Map by Saman Bemel Benrud.

You've probably seen dot maps before which visualize data on a map using differently sized or differently colored dots. This map takes that concept to the next stage by representing the underlying map features data as dots.

The result might not be much use as a map. But as a beautifully abstract interactive dot painting it works just fine.

Mapping New York Taxi Data


This year there has been a number of really great mapped visualizations of New York taxi data. This latest map visualizes taxi traffic from JFK and LGA airports during the 2013 holiday season (Nov 15th to December 31st).

The NYC Taxi Holiday Visualization animates taxi journeys from New York's airports over the course of a month and half. As the animation plays you can view the animated tracks of thousands of individual cab journeys taken from JFK and LGA airports to all parts of the city.

While the animation plays out on the map the side-panel keeps a running total of the number of taxi trips taken from each of the airports' terminals. A bar graph at the bottom of the map also reveals the number of taxi journeys taken on each day. The graph reveals the drop in flights during Thanksgiving and a distinct rise in traffic after the holiday weekend as people fly back into NYC, presumably after visiting family outside of the city.


NYC Taxis: A Day in the Life is a MapBox visualization of the journey of one New York taxi over the course of 24 hours.

The map animates one New York taxi's route over the course of one day. As the animation plays the taxi's position is shown by a yellow circle map marker. All the passenger journeys are added to the map with a blue polyline. While the animation plays the map also keeps a running total of the cab's total number of passengers, fares and tips received.

Once you have viewed a day in the life of this New York taxi you can choose from another one of thirty cab journeys mapped over 24 hours.


Hubcab is a mapped visualization of 170 million taxi trips over one year in New York City. Using the map it is possible to view all pickup and drop-off points in the city and to view the number of trips taken between two separate locations.

Locations that were used as taxi pickup points in the city are shown as yellow dots on the map and drop-off points are shown as blue dots. It is also possible to refine the results displayed on the map by time of day.

You can view the number of taxi journeys between two different locations  by dropping two markers on the map. After you place the markers on the map you can see the number of taxi journeys taken in one year in both directions between the two locations. You can even refine the results by time of day to explore when the most journeys between the two points are made at different times of the day.