There are times when you need to calculate the width of a string of text but do not have access to a text rendering engine.

Letters in a (non-monospaced) font all take up different widths so at minimum we have to build a map of all the available characters we will need. After that there is the complexity of taking into account kerning, this is where certain character pairs are specifically moved closer or further from each other to improve the look of the font.

Although device orientation APIs have been around for over 10 years now, they are still a complete mess of competing standards, experimental features and vendor specific prefixes.

This page is inspired by the very useful: timvolodine.github.io/deviceorientation-test, but updated to include API changes which have occurred since.

All the major raster map services use the same 'slippy map' tiling technique to create the grid of images. When dealing with map servers it can be useful to view them.

Here is my basic OpenLayers/OpenStreetMap implementation based around the ol.source.TileDebug and the OpenStreetMap implementation to calculate between coordinate and tile positions.

A tool which takes a CSV file, uses the first row as the field names and produces the CREATE TABLE and LOAD DATA SQL commands to import it into MariaDB/MySQL.

Geohashes provide a well tested method of parcelling the worlds surface into smaller and smaller discrete areas.

When dealing with geospacial data I often find myself returning to them as an elegant and simple technique of implementing searches against the data. There are enough articles out there on how they are created or how to use them for searching so I will not replicate those.

RGB565 is used to represent colours in 16 bits, rather than the 24bit (RGB888) web pages use to specify colours. To make full use of the 16 bits, red and blue are encoded in 5 bits and green in 6 bits. This is due to the human eyes capacity to see more shades of green.

A tool (like diff) to show the differences between 2 URLs, in particular including the query string broken down into an object structure.

OpenSeadragon: An open-source, web-based viewer for zoomable images, implemented in pure JavaScript, for desktop and mobile.

Raphaël: is a small JavaScript library that should simplify your work with vector graphics on the web.

After researching around, no one seemed to have posted a proper working OpenSeadragon/SVG overlay. Let's get these working together for some rich data overlay goodness: