Sunday, December 11, 2016

Interactive Maps and JavaScript

There are two major libraries for displaying interactive maps using JavaScript.

  • Leaflet is quite easy to use, yet powerful enough for many if not most applications.
  • OpenLayers 3 has more features but requires you to learn more before you can use it.

OpenLayers is used at our company to provide an application that is used in a number of locations, namely for the map of Cologne (at Seems as if they don't update their English pages that regularly, is updated considerably more frequently.

Anyway, for a private project I use Leaflet instead. It visualizes the location of the Stolpersteins in Bonn and the nearby region. You can find it at It is part of the Code for Bonn project which in turn is part of the Code for Germany project, the German twin of Code for America.

The stolpersteins shown are taken directly from the OpenStreetMap database so adding a new stolperstein to the database means improving OpenStreetMap.

Math in the World of HTML and JavaScript

At work I use a lot of JavaScript as our company (among other products) offers a map client that runs in browsers. As a side effect I frequently come across interesing JavaScript libraries. I find worth sharing. Here is an example of using JavaScript to display math formulas in a nicely formatted manner. To give an example, Einstein's famous formula will look like this:


The library used for this display is MathJax. It should be sufficient for everything formula you reasonably expect on a website that does not dig deep into natural sciences or mathemtatics. In most cases it should even suffice for these fields of application. Here is a slightly odder example:

$U^{ik} = \frac{c_g^2}{4\pi G} = \left(-g^{im} \Phi_{mr}\Phi^{rk} + \frac{1}{4} g^{ik}\Phi_{rm}\Phi^{mr} \right), \quad -\nabla_\beta U^{\alpha\beta} = \Phi_k^\alpha J^k$

Well, maybe we better say it should be sufficient for almost any application ;-)