Find Movies – by Location & Period!

In September, we were graced with the Movie Scene Map, an interactive map that makes it easy to find where iconic movie scenes were filmed, and the World Cinema Atlas, which allows you to discover movies by where they were set Now, a new interactive map lets you discover films by both where and when they take place. If you have a keen interest in watching a movie set in a particular time and place, then TitleAtlas is the interactive map for you. For example, you could use TitleAtlas to search for films set in 19th-century New York (Gangs of New York, Little Women, etc), or to find movies set in London during the Swinging Sixties (The Krays, Quadrophenia, etc). The TitleAtlas search... more →
Posted in: Interactive Maps

Adding My Latest CodePens to My Blog

I’ve been a fan of CodePen for many, many years, and it’s one of the few services I spend money on to help support. A few months back, they released an entirely new version that dramatically improved the service (CodePen 2.0) and it just made me more happy I was a supporter. Just a few days ago they announced more changes including a full API. I thought it would be fun to add a display of my recent pens. Yes, I thought that would be fun, because that’s the kind of nerd I am. Adding Dynamic Content to a SSG It has been a very long time since I blogged about anything related to static site generators. There’s no particular reason for that, but I figure this is a good time... more →
Posted in: JavaScript

A Year of Lightning

This animated map shows a year’s worth of lightning strikes across the United States. The animation reveals the clear seasonal patterns of lightning storms across the U.S. As you watch the animation, you can see the country’s lightning season move northwards with the changing seasons. During winter, lightning is largely confined to the Gulf Coast before activity spreads north in spring. By summer, thunderstorms are lighting up much of the country, with particularly intense activity across Florida and the Southwest, before the storms retreat south again in autumn. The map is one of the latest visualizations from the ever impressive mapped.earth. I recently featured mapped.earth’s... more →
Posted in: Interactive Maps

A Not-So-Simple RSS App in TypeScript

Ok, I lie, this demo is also pretty simple, but I wanted to break the pattern of the last few posts and at least pretend this example is a bit more complex. As I try to find excuses to write more TypeScript, I thought a great example of that would be a simple RSS aggregator. You hit the site, tell it the feeds you care about, and it renders a date sorted list of entries. Because RSS typically can’t be parsed in client-side JavaScript (don’t know why? ask me below!) so I’d have to make use of a serverless function to proxy the calls (and at the same time, handle turning the XML into JSON). Now, to be fair, I had built nearly the same thing back in February: Building an RSS Aggregator... more →
Posted in: JavaScript

Providing Global Relief

Bert Spaan has taken Mapterhorn’s global terrain data to create an interactive global Relief map. What is particularly interesting about this new map is that, unlike traditional topographic maps with a fixed colour-to-elevation scale, the map’s colour spectrum adapts dynamically to the specific region or bounds currently in view. As you pan and zoom across different landscapes, the colour grading shifts to highlight local topographic variations, producing a striking and constantly changing view of the world’s mountains, valleys and plains. This works particularly well when switching between very different environments: the colour range changes to bring out the relief at the... more →
Posted in: Interactive Maps

A Simple Weather App in TypeScript

Happy Sunday, my fellow nerds. If you’ve been keeping up with my posts (all 4 of you – thank you!) then you know I’ve been experimenting with TypeScript (and Vite) recently. This past week I decided to try building a real "app", and of course by app I mean something incredibly small, but a bit "real world"-ish to kind of get a feel for what the development process felt like. I decided on a fairly simple weather application. The application would prompt you for a location. That location gets geocoded to longitude and latitude values. With those values, I’d grab a simple weather forecast. After you add one, you can add another, and delete as well. Finally,... more →
Posted in: JavaScript

Using AI to Annotate Vintage Maps

Bosphore 1819 is an interactive version of a beautiful 1819 topographical map of the Bosphorus. The original Plan Topographique du Bosphore de Thrace ou Canal de Constantinople et de ses environs was surveyed by François Kauffer between 1776 and 1786, before being redrawn and expanded by Jean-Denis Barbié du Bocage and published in 1819. The original map is wonderfully detailed, but navigating it isn’t particularly easy – particularly if you can’t speak or read French. Hundreds of villages, palaces, fortifications, streams, capes and other landmarks are labelled using French spellings of Ottoman Turkish names. Bosphore 1819 turns all those labels into a database that can... more →
Posted in: Interactive Maps

Shine a Light

There are plenty of maps that show you where the world’s lighthouses are. Lighthouses, live does something much more interesting: it shows you how they actually work. Instead of just showing each lighthouse as a static point on a map this map gives you a sense of what its light signal actually looks like at sea. Lighthouses, live plots charted coastal lights on a dark, night-time relief map and animates each one according to its real-world light characteristics. Some lights sweep continuously across the sea, while others flash in distinctive sequences, with the timing and colour of each beam taken from nautical charts. Impressively, terrain data is also used to block the light based on... more →
Posted in: Interactive Maps
1 2 3 … 247