2030-watch.de showcases around 60 indicators (measurements) of countries' progress towards the UN 2030 Sustainability Development Goals. Not only the scores of the countries are important but also a host of metadata about how the indicator was put together and calculated and by whom.
Bootstrap is used for layout, SCSS for styling. This gets automatically compiled into CSS by Jekyll. D3 and Highcharts are used for the visualizations. JQuery and Markdown are used as required.
- Install Ruby and Jekyll if necessary
- Install the jekyll-polyglot module. A Gemfile is included in the repo
- Install dependencies with
- Build the site with
bundle exec jekyll serve
Indicators are provided as JSON files, one per indicator, in the folder
The JSON files should never be created directly but instead using the 2030-watch-dataprocessing repository which turns tabular Google Sheets into valid JSON files (and does a certain amount to ensure conformity).
Data on sponsors (organizations that maintain an indicator) is in the folder
_data/sponsors. At this time it is recommended when creating a new sponsor to just copy an existing one and change the values. Logos for the sponsors are found in the folder
static/img/logos and should be 200 pixels wide. The name of the sponsor in the sponsor JSON needs to match the name of the "sponsor" key in the indicator JSON. If this sponsor does not exist this is OK.
Data on the SDGs can be found in
_data/sdgs.json. The "content" properties are currently not used and are therefore also not translated into English.
Translated strings are in
config.yml. They can be accessed in templates by adding
Intro to the visualisations