Skip to content

Commit

Permalink
Refactor into Jekyll theme - initial
Browse files Browse the repository at this point in the history
  • Loading branch information
AndrewIOM committed May 30, 2018
1 parent f5695bc commit 84ef700
Show file tree
Hide file tree
Showing 46 changed files with 15,214 additions and 367,306 deletions.
4 changes: 3 additions & 1 deletion .gitignore
@@ -1,4 +1,6 @@
_site/
.sass-cache/
.jekyll-metadata
.DS_Store
.DS_Store

node_modules
37 changes: 35 additions & 2 deletions README.md
@@ -1,2 +1,35 @@
# thalloo
A simple, static framework for visualising geo-temporal datasets
# *Thalloo* Evidence-Mapping: A Jekyll Theme

This project provides an easy-to-use template for web visualisations of environmental evidence maps.

## What is an evidence map?

Evidence maps provide a comprehensive overview - or *map* - of a particular topic. In environmental sciences, many maps are geo-temporal in nature, capturing evidence across space and through time. All evidence maps are created using evidence-based or systematic methodologies, providing rich datasets. However, exploration of these datasets can be challenging when interrogating the raw data itself.

## What is Thalloo?

Thalloo is a combination of map components and a Jekyll theme that enable quick, simple, and customisable deployment of a web-based tool to display evidence maps. The framework has the following features:

- Visual clustering and display of categorical data. Given a display category (e.g. crop, commodity), and a custom colour palette, points are displayed on a map. Depending on the zoom level and extent, points are clustered dynamically for best display. Any cluster can be selected to see the full metadata about the evidence points it contains.

- **Filtering**. Data can be filtered by property in real time, using multiple filters within a property, and using multiple properties to filter.

- **Slicing of dimensionality**. Given continuous data (e.g. publication year, time, or an effect size), the map allows real time 'slicing' of the dataset along one or many dimensions.

- **Abstract and funding logos**. Provide attribution to your funders and partner institutions by including their logos at the top of your map view.

## Technology

The mapping components are written using D3.js. The website is static, and can be compiled using the Jekyll static site builder. All code is TypeScript.

## How can I use it?

You can host one or many evidence maps using GitHub Pages' free hosting.

Thalloo is provided as a Jekyll gem theme. A starter template will be provided, which can be forked (coming soon), or the gem can be installed directly as a Jekyll template when setting up your site.

A simple JSON configuration file is required, alongside a UTF8 tab delimited sheet of your coded data. Note that Thalloo currently only support geographical data, so each data row must have a latitude and longitude in decimal degrees.

[Code being developed under MIT license here](https://github.com/AndrewIOM/thalloo)

[An example instance is available to view here](https://oxlel.github.io/evidencemaps)
4 changes: 2 additions & 2 deletions _config.yml
Expand Up @@ -7,8 +7,8 @@
title: Thalloo Maps
description: > # this means to ignore newlines until "baseurl:"
A range of environmental datasets that can be visualised across space and through time.
baseurl: "/thalloo" # the subpath of your site, e.g. /blog
url: "http://acm.im" # the base hostname & protocol for your site
baseurl: "" # the subpath of your site, e.g. /blog
url: "http://some.url" # the base hostname & protocol for your site

# Internal configuration
markdown: kramdown
Expand Down
15 changes: 2 additions & 13 deletions _includes/head.html
Expand Up @@ -2,23 +2,12 @@
<meta charset="utf-8">
<title>{% if page.title %}{{ page.title | escape }}{% else %}{{ site.title | escape }}{% endif %}</title>
<meta name="description" content="{% if page.excerpt %}{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}">
<link rel="stylesheet" href="{{ "/css/main.css" | prepend: site.baseurl }}">
<link rel="stylesheet" href="{{ "/dist/css/styles.css" | prepend: site.baseurl }}">
<link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}">
<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css" />
<link rel="icon" type="image/png" href="/images/favicon.png">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/10.0.0/nouislider.min.css" />
<link href="https://fonts.googleapis.com/css?family=Libre+Baskerville" rel="stylesheet">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="https://d3js.org/d3-queue.v3.min.js"></script>
<script src="https://d3js.org/topojson.v1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Turf.js/4.3.1/turf.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/10.0.0/nouislider.min.js"></script>

<script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>
<!-- <script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script> -->
</head>
File renamed without changes.

0 comments on commit 84ef700

Please sign in to comment.