Add hex map sliders

open-innovations · Sep 2, 2024 · d8d8751 · d8d8751
1 parent 5a6a457
commit d8d8751
Showing 1 changed file with 26 additions and 9 deletions.
diff --git a/src/data/hexmaps/index.vto b/src/data/hexmaps/index.vto
@@ -4,7 +4,8 @@ section: data
 colour: c5-bg
 desc: "Local authority based hex maps for housing data"
 ---
-<h3>Vacant homes (%) in England in 2023</h3>
+{{# {{ JSON.stringify(vacantHomes()) }} #}}
+<h3>Vacant homes (%) in England & Wales</h3>
 {{ comp.oi.map.hex_cartogram({
 	config: {
 		width: 600,
@@ -16,12 +17,16 @@ desc: "Local authority based hex maps for housing data"
 				template: "{{ n }}"
 			}],
 		matchKey: "geography_code",
-		value: "AllVacants_pct",
+		value: 2023,
 		min: 0,
-		max: 5,
+		max: 7.5,
 		legend: { 
 			position: "top right",
 			items: [{
+				value: 7.5,
+				label: '>7.5%'
+				},
+				{
 				value: 5,
 				label: '5%'
 				},
@@ -35,6 +40,9 @@ desc: "Local authority based hex maps for housing data"
 				}] 
 			},
 		tools: {
+			slider: { 
+				columns: [2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021, 2022, 2023] 
+				},
 			filter: {
 				label: "filterLabel",
 				position: "top left"
@@ -54,7 +62,7 @@ desc: "Local authority based hex maps for housing data"
 				"stroke-opacity": 0.5
 			}
 			},
-		tooltip: "<strong class='subtitle'>{{ n }}</strong><br />All vacant homes: <strong>{{ AllVacants_pct }}</strong>%",
+		tooltip: "<strong class='subtitle'>{{ n }}</strong><br />{{ _value }}: <strong>{{ {{ _value }} }}</strong>%",
 		attribution: "<strong>Data:</strong> Vacant home percentages are calculated by dividing the respective counts in <a href='https://www.gov.uk/government/statistical-data-sets/live-tables-on-dwelling-stock-including-vacants'> Table 615: vacant dwellings by local authority district: England, from 2004</a> by the dwelling count estimates in <a href='https://www.gov.uk/government/statistical-data-sets/live-tables-on-dwelling-stock-including-vacants'> Table 125: dwelling stock estimates by local authority district</a>." 
 		}
 }) }}
@@ -63,27 +71,27 @@ desc: "Local authority based hex maps for housing data"
 	Data for Northern Ireland, Scotland and Wales are published seperately and are not currently included on this site.
 </p>
 
-<h3>Median house price to residence-based earnings ratio in England, 2023</h3>
+<h3>Median house price to residence-based earnings ratio in England & Wales</h3>
 
 {{ comp.oi.map.hex_cartogram({
 	config: {
 		width: 600,
 		hexjson: "hexjson.uk-local-authority-districts-2023",
-		data: housepriceratio(),
+		data: housePriceRatio(),
 		scale: 'Viridis',
 		columns: [{
 				name: 'filterLabel',
 				template: "{{ n }}"
 			}],
 		matchKey: "geography_code",
-		value: "value",
+		value: 2023,
 		min: 0,
 		max: 30,
 		legend: { 
 			position: "top right",
 			items: [{
 				value: 30,
-				label: '30'
+				label: '30+'
 				},
 				{
 				value: 15,
@@ -114,7 +122,16 @@ desc: "Local authority based hex maps for housing data"
 				"stroke-opacity": 0.5
 			}
 			},
-		tooltip: "<strong class='subtitle'>{{ n }}</strong><br />Ratio: <strong>{{ value }}</strong>",
+		tools: { 
+			slider: { 
+				columns: [2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021, 2022, 2023] 
+				},
+			filter: {
+				label: "filterLabel",
+				position: "top left"
+				}
+			},
+		tooltip: "<strong class='subtitle'>{{ n }}</strong><br />{{ _value }}: <strong>{{ {{ _value }} }}</strong>",
 		attribution: "<strong>Data:</strong> Office for National Statistics <a href='https://www.ons.gov.uk/peoplepopulationandcommunity/housing/datasets/ratioofhousepricetoresidencebasedearningslowerquartileandmedian'>House price to residence-based earnings ratio</a>" 
 		}
 }) }}