@aftertheflood/londonsquared/README.md

Visualise london borough data in the style of After the Floods London Squared cartograms

A D3  module to support the creation of [London Squared](https://aftertheflood.com/projects/future-cities-catapult/) cartograms.

 * [Getting started](/londonsquared/getting-started)
 * [API documentation](/londonsquared/api)
 * [More about the thinking behind London Squared](/londonsquared/design-process)
 * [Code on github](https://www.github.com/aftertheflood/londonsquared)

## Examples

<div class="grid-container">
  <div markdown="1">

### Putting a map on a page

![a simple and colourful cartogram of London](assets/images/example1.png)

 * [Observable notebook](https://beta.observablehq.com/@tomgp/london-squared)
 
  </div>
  <div markdown="1">

### Single variable visualisation

![a cartogram showing a single variable visualised as circles](assets/images/example2.png)

 * [Demo](/londonsquared/site/london-borough-population-now.html)
 * [Code](https://github.com/aftertheflood/londonsquared/blob/master/site/london-borough-population-now.html)
 * [Observable notebook](https://beta.observablehq.com/@tomgp/london-squared-population-map)
 
  </div>
  <div markdown="1">

### A multi-variable visualisation

![a cartogram showing a bar chart and colour coding on each element](assets/images/example4.png)

 * [Demo](/londonsquared/site/london-pcn-data.html)
 * [Code](https://github.com/aftertheflood/londonsquared/blob/master/site/london-pcn-data.html)
 * [Observable notebook](https://beta.observablehq.com/@tomgp/london-squared-penalty-charge-map)

  </div>
  <div markdown="1">

### Time series visualization

![a london squared cartogram with a line chart drawn in each cell](assets/images/example3.png)

 * [Demo](/londonsquared/site/london-borough-population-timeseries.html)
 * [Code](https://github.com/aftertheflood/londonsquared/blob/master/site/london-borough-population-timeseries.html)
 * [Observable notebook](https://beta.observablehq.com/@tomgp/london-squared-population-timeseries)

  </div>
  <div markdown="1">

### Adding interaction

![a london squared cartogram with an image of a mouse pointer](assets/images/example5.png)

 * [Demo](http://aftertheflood.github.io/londonsquared/site/london-borough-population-interactive.html)
 * [Code](https://github.com/aftertheflood/londonsquared/blob/master/site/london-borough-population-interactive.html)

  </div>
  <div markdown="1">

### Area and greenspace

![a cartogram showing the proportion of greenspace in each london borough](assets/images/example6.png)

 * [Observable notebook](https://beta.observablehq.com/@tomgp/london-squared-greenspace-map)

  </div>
</div>

---
### Release notes

_v0.3.2_ : dependency security fix 
_v0.3.1_ : dependency security fix 

---

### About us
[After the flood](http://aftertheflood.com/) is a design consultancy based in London. We work with global corporations like Google, Nikkei and Ford to solve business problems that combine our understanding of AI and data as a material with unique user insight. Our consulting model means guaranteed access to our top team. Our approach is user-centred and lean, showing progress to clients and working with a variety of expert partners.