Built with blockbuilder.org
This is an example of using the D3 force layout to visualise the relationships between the E-roads and Kommuner in Sweden. You can find more open data from the Swedish Lantmäteriet here.
Built with blockbuilder.org
This is an example of using the D3 force layout to visualise the relationships between the E-roads and Kommuner in Sweden. You can find more open data from the Swedish Lantmäteriet here.
KOMMUN,KOMMUNKOD,year,pop,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53 | |
Botkyrka,127,2015,66519,210,239,219,238,244,271,276,280,329,302,296,297,304,273,318,320,341,314,353,336,296,310,313,338,312,284,236,233,209,230,237,265,307,274,288,277,296,285,290,278,254,258,231,209,245,268,254,272,245,262,224,230,232 | |
Danderyd,162,2015,22294,168,178,195,196,183,166,188,213,216,228,216,233,266,278,286,268,246,195,221,212,221,254,206,241,244,172,140,141,162,162,147,144,161,196,207,186,238,259,238,197,218,206,233,237,240,306,235,259,245,254,236,226,214 | |
Ekerö,125,2015,19079,51,65,77,83,102,122,106,103,108,106,117,112,141,125,124,126,116,121,163,140,136,134,131,114,79,98,88,95,94,87,79,90,91,110,104,110,116,130,109,101,96,98,102,98,91,89,94,118,95,98,93,90,87 | |
Haninge,136,2015,62730,134,211,197,234,301,315,279,286,306,315,323,335,371,359,384,397,362,333,376,357,369,365,310,288,244,245,235,251,250,262,274,289,309,329,310,333, |
for f in ./*.png; do { printf "data:image/png;base64,"; openssl enc -base64 -A -in $f; } > $f.txt; done |
unzip file.zip -d ~/path/to/location |
const BASE_SIZE = 14; | |
// Golden Ratio / Fibonacci Sequence | |
// 0 1 1 2 3 5 8 13 21 ... | |
const UI_THEME = { | |
fonts: { | |
xxs: BASE_SIZE * | |
} | |
} |
I tried a few different techniques to make a GIF via command-line and the following gives me the best control of quality and size. Once you're all setup, you'll be pumping out GIFs in no time!
Install FFmpeg
Install ImageMagick
$baseFont: 1; | |
$fontScale: 1.618; // Golden Ratio | |
$baseLineHeight: 1.4 * $baseFont; | |
$small: $baseFont / $fontScale; | |
$regular: $baseFont; | |
$medium: $baseFont * $fontScale; | |
$large: $medium * $fontScale; | |
$xLarge: $large * $fontScale; |
$baseColor: rgb(255, 255, 255); | |
$palette-settings: ( | |
primary: ( | |
base: rgb(76, 40, 24), | |
terracotta: rgb(168, 102, 78), | |
grey: rgb(94, 91, 84), | |
tan: rgb(180, 120, 65), | |
creme: rgb(161, 146, 111) | |
), |
A Pen by Owain Stratton on CodePen.