Visualizing London's Brexit vote

UCL dataviz 2026

\n This is a visualization of Brexit voting patterns for the London\n boroughs by various demographic groups included in the survey.\n

\n Interesting correlations were found for age, immigrant status,\n educational attainment and geographic location.\n

\n\n

Flexbox foursome

\n Below you'll see a div of 'container' class (flex display with direction\n column) containing two divs of 'row' class (flex display with direction\n row).
\n The rows each contain two divs of class chart-container with equal\n 'flex' value (same width). Three of the boxes contain charts, the fourth\n notes in a div of class 'sidebar'. Use the 'styles/index.css' CSS file\n to add class (.) flex rules that achieve the desired 2x2 grid shown in\n the lecture 3 notebook.\n

\n \n \n

\n \n

\n\n

Remain vs Leave votes for the London Boroughs

\n Comparing remain vs leave voting percentages for the London boroughs\n shows a very different voting patterns, from the very strong leave\n majority of Barking and Dagenham to an even stronger remain vote in\n boroughs such as Lambeth and Islington.\n

\n\n

\n \n \n

\n \n

\n\n

Mapping Brexit London

\n This map shows the Remain voting percentages for the central London\n boroughs. Note the rough correlation between distance from the center of\n London and tendency to vote Leave.\n\n \n

\n \n

\n \n \n\n

\n \n

\n \n \n \n \n \n \n \n",[166],"2fe614ce-ed81-11f0-8651-42dde27851f2","favicon.svg","019ba3d1-3692-777d-9915-48d11ed2e0dd",["D",1767979955823],"",[172],"2fe5f156-ed81-11f0-8651-42dde27851f2","README.md","019ba3d1-3692-777d-9915-47f413b36b24",["D",1767979955823],"# Welcome to Val Town\n\nVal Town is the simplest way to get code running in the cloud.\n\nThis is a basic HTML starter template.\n\n1. Click `Remix` on this val to get a copy of it\n2. Click `main.tsx` to view the website\n3. Saves to any file will instantly deploy\n\n### ← main.tsx\n\nThis HTTP server hosts all of the other files in this val.\n\nTo view your site in a new tab, click on the `...` menu of `main.tsx` to copy\nyour live HTTP endpoint.\n\n### ← README.md\n\nThat's this file, where you can tell people what your cool website does and how\nyou built it.\n\n### ← index.html\n\nWhere you'll write the content of your website.\n\n### ← style.css\n\nCSS files add styling rules to your content.\n\n### ← script.js\n\nIf you're feeling fancy you can add interactivity to your site with JavaScript.\n\nIf you want more interactivity, check out this\n[React starter](https://www.val.town/x/std/reactHonoStarter).\n\n### ← favicon.svg\n\nThe icon that shows up in the brower tab. Tip: AIs are pretty good at writing\nSVG favicons.\n\n---\n\nThis template was inspired by https://glitch.new/blank.",[178],"2fe5e6ca-ed81-11f0-8651-42dde27851f2","scripts","019ba3d1-3692-777d-9915-403dec48afd7",["D",1767979955823],"directory",[184],"b828c912-ed81-11f0-8439-42dde27851f2","images","b693b878-ed81-11f0-8276-42dde27851f2",["D",1767980184425],[190],"b439d846-ed81-11f0-b5c9-42dde27851f2","data","b2d5764a-ed81-11f0-a274-42dde27851f2",["D",1767980177865],[195],"pulls","forks","envVars",{"_205":55,"_207":55},"connections",{"_205":55,"_206":55},"count","unfilledCount","emptyCount",{"_20":194,"_13":195,"_135":196,"_137":-5,"_138":21,"_139":34,"_141":51,"_22":262,"_29":143,"_144":187,"_145":-5,"_147":40,"_148":-5,"_220":263,"_92":264},{"_20":189,"_13":190,"_135":191,"_137":-5,"_138":21,"_139":161,"_141":51,"_22":259,"_29":143,"_144":187,"_145":-5,"_147":40,"_148":-5,"_220":260,"_92":261},{"_20":183,"_13":184,"_135":185,"_137":-5,"_138":21,"_139":143,"_141":51,"_22":256,"_29":55,"_144":187,"_145":-5,"_147":40,"_148":-5,"_220":257,"_92":258},{"_20":247,"_13":248,"_135":249,"_137":185,"_138":21,"_139":250,"_141":51,"_22":251,"_29":252,"_144":162,"_145":253,"_147":40,"_148":-5,"_220":254,"_92":255},{"_20":238,"_13":239,"_135":240,"_137":185,"_138":21,"_139":241,"_141":51,"_22":242,"_29":243,"_144":162,"_145":244,"_147":40,"_148":-5,"_220":245,"_92":246},{"_20":177,"_13":178,"_135":179,"_137":-5,"_138":21,"_139":143,"_141":51,"_22":235,"_29":55,"_144":104,"_145":181,"_147":40,"_148":-5,"_220":236,"_92":237},{"_20":171,"_13":172,"_135":173,"_137":-5,"_138":21,"_139":143,"_141":51,"_22":232,"_29":55,"_144":104,"_145":175,"_147":40,"_148":-5,"_220":233,"_92":234},{"_20":165,"_13":166,"_135":167,"_137":-5,"_138":21,"_139":30,"_141":51,"_22":229,"_29":140,"_144":104,"_145":169,"_147":40,"_148":-5,"_220":230,"_92":231},{"_20":156,"_13":157,"_135":158,"_137":-5,"_138":21,"_139":159,"_141":51,"_22":226,"_29":161,"_144":162,"_145":163,"_147":40,"_148":-5,"_220":227,"_92":228},{"_20":150,"_13":151,"_135":49,"_137":-5,"_138":21,"_139":143,"_141":51,"_22":223,"_29":55,"_144":153,"_145":154,"_147":40,"_148":-5,"_220":224,"_92":225},{"_20":133,"_13":134,"_135":136,"_137":-5,"_138":21,"_139":140,"_141":51,"_22":219,"_29":143,"_144":104,"_145":146,"_147":40,"_148":-5,"_220":221,"_92":222},["D",1767982896978],"children",[],[134],["D",1767979955823],[],[151],["D",1768240645599],[],[157],["D",1768240705303],[],[166],["D",1767979955823],[],[172],["D",1767979955823],[],[178],"659e6122-ed93-11f0-8aab-42dde27851f2","brexit_map.js","723e6464-ed8d-11f0-b962-42dde27851f2",33,["D",1767987776926],7,"var brexitMapJSON = '{\"data\":[{\"customdata\":[[24.71,\"City of London\"],[62.44,\"Barking and Dagenham\"],[37.77,\"Barnet\"],[62.95,\"Bexley\"],[40.26,\"Brent\"],[49.35,\"Bromley\"],[25.06,\"Camden\"],[45.71,\"Croydon\"],[39.6,\"Ealing\"],[44.18,\"Enfield\"],[44.41,\"Greenwich\"],[21.52,\"Hackney\"],[29.98,\"Hammersmith and Fulham\"],[24.43,\"Haringey\"],[45.37,\"Harrow\"],[69.66,\"Havering\"],[56.37,\"Hillingdon\"],[48.94,\"Hounslow\"],[24.78,\"Islington\"],[31.31,\"Kensington and Chelsea\"],[38.39,\"Kingston upon Thames\"],[21.38,\"Lambeth\"],[30.14,\"Lewisham\"],[37.06,\"Merton\"],[47.16,\"Newham\"],[46.03,\"Redbridge\"],[30.71,\"Richmond upon Thames\"],[27.19,\"Southwark\"],[53.72,\"Sutton\"],[32.54,\"Tower Hamlets\"],[40.9,\"Waltham Forest\"],[24.97,\"Wandsworth\"],[31.03,\"Westminster\"]],\"hovertemplate\":\"size=%{marker.size}\\\\u003cbr\\\\u003elat=%{lat}\\\\u003cbr\\\\u003elon=%{lon}\\\\u003cbr\\\\u003ePct_Leave=%{customdata[0]}\\\\u003cbr\\\\u003eArea=%{customdata[1]}\\\\u003cextra\\\\u003e\\\\u003c\\\\u002fextra\\\\u003e\",\"lat\":{\"dtype\":\"f8\",\"bdata\":\"j17Dwv\\\\u002fBSUDCUyNP7cZJQB2s\\\\u002f3OY00lA+2iC8oi4SUB0tRX7y8ZJQNXW4xmPs0lA2VB7W3rFSUAaLEHrhq9JQH\\\\u002fPWbCewUlAvVpJhnfTSUBKtOTxtL1JQK5vFuWIxUlA8xB8wsi\\\\u002fSUBhEP1\\\\u002fQctJQLVOAdVkzElApurDH2rHSUBzeb1FccVJQKk8cIT7u0lAKN1MO+vESUAUkQZcfMBJQGgFhqxutElA347LE2O\\\\u002fSUCUW0nhMLtJQMpUHGKXtElA6+7wjdfDSUCtQhTdxMlJQDjUlAlkuElAWEgKdo27SUDHHSVlwa1JQESLbOf7wUlACJPi45PMSUBf8S\\\\u002fdf7pJQMn9s4sOwElA\"},\"legendgroup\":\"\",\"lon\":{\"dtype\":\"f8\",\"bdata\":\"8Z\\\\u002fJWTONt78ikcGIwEPDP70ep0MCocm\\\\u002fmWA41zBDwz8bnl4pyxDTvwCYIUToVo4\\\\u002fC\\\\u002fKTqCfMxL9aKJmc2hm6vwBbuXJRiNO\\\\u002fklfnGJC9tL+V7H1PUZpyvyXiUjr9Ram\\\\u002fTFYEwRwrzb8GBFmg9P26v65ixhtmltW\\\\u002fFH4nsd35zz9kI8r+hLHcv8VIQJZPINe\\\\u002fwh80cWGTub9+Lx1td7PJvyZG4FnMmdO\\\\u002f2fhdIijIvb8IJu38kdiEv5pBAb6QE8i\\\\u002fIQOw+zIDnj\\\\u002fAo9ew8D+nP7Rn+FJdsNO\\\\u002fT5tohDSrsb9Ckt31ZznGv2AHzhlR2qu\\\\u002fiJO0kR0qkr+JEA1BxLzIv4k5Usd0MsC\\\\u002f\"},\"marker\":{\"color\":\"green\",\"size\":{\"dtype\":\"f8\",\"bdata\":\"ibSh+7FvRkCBXoY1KtVRQLxzhqclvUtA7y3gTsXnUUCeM53ye6NMQNqzB5YOtU9AjkyC3TqYRkBcE2aY+INOQA+yLUckZ0xAOCbmHB4ATkDFCuM6FRROQH51TeQj8ERAcclFSpu2SEBPsBJzD09GQLlB5QTdZk5A68CkS+LVUkAG49hqmPFQQPG9krREk09AJdmvNdN3RkBEiD\\\\u002fJakFJQEhiJ2ox90tAb0pyJa3eREAHqUJid8dIQO450jgWektActi5iOj+TkBZpKKRRJ9OQMAYuxwrA0lAhwdBHwmJR0AnnKw\\\\u002faYpQQLoAXnswv0lAcKSJCofdTECkeWZ71Y1GQI6QT1FxJElA\"},\"sizemode\":\"area\",\"sizeref\":0.18835484245036166},\"mode\":\"markers\",\"name\":\"\",\"showlegend\":false,\"subplot\":\"map\",\"type\":\"scattermap\"}],\"layout\":{\"template\":{\"data\":{\"histogram2dcontour\":[{\"type\":\"histogram2dcontour\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"},\"colorscale\":[[0.0,\"#0d0887\"],[0.1111111111111111,\"#46039f\"],[0.2222222222222222,\"#7201a8\"],[0.3333333333333333,\"#9c179e\"],[0.4444444444444444,\"#bd3786\"],[0.5555555555555556,\"#d8576b\"],[0.6666666666666666,\"#ed7953\"],[0.7777777777777778,\"#fb9f3a\"],[0.8888888888888888,\"#fdca26\"],[1.0,\"#f0f921\"]]}],\"choropleth\":[{\"type\":\"choropleth\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}],\"histogram2d\":[{\"type\":\"histogram2d\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"},\"colorscale\":[[0.0,\"#0d0887\"],[0.1111111111111111,\"#46039f\"],[0.2222222222222222,\"#7201a8\"],[0.3333333333333333,\"#9c179e\"],[0.4444444444444444,\"#bd3786\"],[0.5555555555555556,\"#d8576b\"],[0.6666666666666666,\"#ed7953\"],[0.7777777777777778,\"#fb9f3a\"],[0.8888888888888888,\"#fdca26\"],[1.0,\"#f0f921\"]]}],\"heatmap\":[{\"type\":\"heatmap\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"},\"colorscale\":[[0.0,\"#0d0887\"],[0.1111111111111111,\"#46039f\"],[0.2222222222222222,\"#7201a8\"],[0.3333333333333333,\"#9c179e\"],[0.4444444444444444,\"#bd3786\"],[0.5555555555555556,\"#d8576b\"],[0.6666666666666666,\"#ed7953\"],[0.7777777777777778,\"#fb9f3a\"],[0.8888888888888888,\"#fdca26\"],[1.0,\"#f0f921\"]]}],\"contourcarpet\":[{\"type\":\"contourcarpet\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}],\"contour\":[{\"type\":\"contour\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"},\"colorscale\":[[0.0,\"#0d0887\"],[0.1111111111111111,\"#46039f\"],[0.2222222222222222,\"#7201a8\"],[0.3333333333333333,\"#9c179e\"],[0.4444444444444444,\"#bd3786\"],[0.5555555555555556,\"#d8576b\"],[0.6666666666666666,\"#ed7953\"],[0.7777777777777778,\"#fb9f3a\"],[0.8888888888888888,\"#fdca26\"],[1.0,\"#f0f921\"]]}],\"surface\":[{\"type\":\"surface\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"},\"colorscale\":[[0.0,\"#0d0887\"],[0.1111111111111111,\"#46039f\"],[0.2222222222222222,\"#7201a8\"],[0.3333333333333333,\"#9c179e\"],[0.4444444444444444,\"#bd3786\"],[0.5555555555555556,\"#d8576b\"],[0.6666666666666666,\"#ed7953\"],[0.7777777777777778,\"#fb9f3a\"],[0.8888888888888888,\"#fdca26\"],[1.0,\"#f0f921\"]]}],\"mesh3d\":[{\"type\":\"mesh3d\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}],\"scatter\":[{\"fillpattern\":{\"fillmode\":\"overlay\",\"size\":10,\"solidity\":0.2},\"type\":\"scatter\"}],\"parcoords\":[{\"type\":\"parcoords\",\"line\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"scatterpolargl\":[{\"type\":\"scatterpolargl\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"bar\":[{\"error_x\":{\"color\":\"#2a3f5f\"},\"error_y\":{\"color\":\"#2a3f5f\"},\"marker\":{\"line\":{\"color\":\"#E5ECF6\",\"width\":0.5},\"pattern\":{\"fillmode\":\"overlay\",\"size\":10,\"solidity\":0.2}},\"type\":\"bar\"}],\"scattergeo\":[{\"type\":\"scattergeo\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"scatterpolar\":[{\"type\":\"scatterpolar\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"histogram\":[{\"marker\":{\"pattern\":{\"fillmode\":\"overlay\",\"size\":10,\"solidity\":0.2}},\"type\":\"histogram\"}],\"scattergl\":[{\"type\":\"scattergl\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"scatter3d\":[{\"type\":\"scatter3d\",\"line\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}},\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"scattermap\":[{\"type\":\"scattermap\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"scattermapbox\":[{\"type\":\"scattermapbox\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"scatterternary\":[{\"type\":\"scatterternary\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"scattercarpet\":[{\"type\":\"scattercarpet\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"carpet\":[{\"aaxis\":{\"endlinecolor\":\"#2a3f5f\",\"gridcolor\":\"white\",\"linecolor\":\"white\",\"minorgridcolor\":\"white\",\"startlinecolor\":\"#2a3f5f\"},\"baxis\":{\"endlinecolor\":\"#2a3f5f\",\"gridcolor\":\"white\",\"linecolor\":\"white\",\"minorgridcolor\":\"white\",\"startlinecolor\":\"#2a3f5f\"},\"type\":\"carpet\"}],\"table\":[{\"cells\":{\"fill\":{\"color\":\"#EBF0F8\"},\"line\":{\"color\":\"white\"}},\"header\":{\"fill\":{\"color\":\"#C8D4E3\"},\"line\":{\"color\":\"white\"}},\"type\":\"table\"}],\"barpolar\":[{\"marker\":{\"line\":{\"color\":\"#E5ECF6\",\"width\":0.5},\"pattern\":{\"fillmode\":\"overlay\",\"size\":10,\"solidity\":0.2}},\"type\":\"barpolar\"}],\"pie\":[{\"automargin\":true,\"type\":\"pie\"}]},\"layout\":{\"autotypenumbers\":\"strict\",\"colorway\":[\"#636efa\",\"#EF553B\",\"#00cc96\",\"#ab63fa\",\"#FFA15A\",\"#19d3f3\",\"#FF6692\",\"#B6E880\",\"#FF97FF\",\"#FECB52\"],\"font\":{\"color\":\"#2a3f5f\"},\"hovermode\":\"closest\",\"hoverlabel\":{\"align\":\"left\"},\"paper_bgcolor\":\"white\",\"plot_bgcolor\":\"#E5ECF6\",\"polar\":{\"bgcolor\":\"#E5ECF6\",\"angularaxis\":{\"gridcolor\":\"white\",\"linecolor\":\"white\",\"ticks\":\"\"},\"radialaxis\":{\"gridcolor\":\"white\",\"linecolor\":\"white\",\"ticks\":\"\"}},\"ternary\":{\"bgcolor\":\"#E5ECF6\",\"aaxis\":{\"gridcolor\":\"white\",\"linecolor\":\"white\",\"ticks\":\"\"},\"baxis\":{\"gridcolor\":\"white\",\"linecolor\":\"white\",\"ticks\":\"\"},\"caxis\":{\"gridcolor\":\"white\",\"linecolor\":\"white\",\"ticks\":\"\"}},\"coloraxis\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}},\"colorscale\":{\"sequential\":[[0.0,\"#0d0887\"],[0.1111111111111111,\"#46039f\"],[0.2222222222222222,\"#7201a8\"],[0.3333333333333333,\"#9c179e\"],[0.4444444444444444,\"#bd3786\"],[0.5555555555555556,\"#d8576b\"],[0.6666666666666666,\"#ed7953\"],[0.7777777777777778,\"#fb9f3a\"],[0.8888888888888888,\"#fdca26\"],[1.0,\"#f0f921\"]],\"sequentialminus\":[[0.0,\"#0d0887\"],[0.1111111111111111,\"#46039f\"],[0.2222222222222222,\"#7201a8\"],[0.3333333333333333,\"#9c179e\"],[0.4444444444444444,\"#bd3786\"],[0.5555555555555556,\"#d8576b\"],[0.6666666666666666,\"#ed7953\"],[0.7777777777777778,\"#fb9f3a\"],[0.8888888888888888,\"#fdca26\"],[1.0,\"#f0f921\"]],\"diverging\":[[0,\"#8e0152\"],[0.1,\"#c51b7d\"],[0.2,\"#de77ae\"],[0.3,\"#f1b6da\"],[0.4,\"#fde0ef\"],[0.5,\"#f7f7f7\"],[0.6,\"#e6f5d0\"],[0.7,\"#b8e186\"],[0.8,\"#7fbc41\"],[0.9,\"#4d9221\"],[1,\"#276419\"]]},\"xaxis\":{\"gridcolor\":\"white\",\"linecolor\":\"white\",\"ticks\":\"\",\"title\":{\"standoff\":15},\"zerolinecolor\":\"white\",\"automargin\":true,\"zerolinewidth\":2},\"yaxis\":{\"gridcolor\":\"white\",\"linecolor\":\"white\",\"ticks\":\"\",\"title\":{\"standoff\":15},\"zerolinecolor\":\"white\",\"automargin\":true,\"zerolinewidth\":2},\"scene\":{\"xaxis\":{\"backgroundcolor\":\"#E5ECF6\",\"gridcolor\":\"white\",\"linecolor\":\"white\",\"showbackground\":true,\"ticks\":\"\",\"zerolinecolor\":\"white\",\"gridwidth\":2},\"yaxis\":{\"backgroundcolor\":\"#E5ECF6\",\"gridcolor\":\"white\",\"linecolor\":\"white\",\"showbackground\":true,\"ticks\":\"\",\"zerolinecolor\":\"white\",\"gridwidth\":2},\"zaxis\":{\"backgroundcolor\":\"#E5ECF6\",\"gridcolor\":\"white\",\"linecolor\":\"white\",\"showbackground\":true,\"ticks\":\"\",\"zerolinecolor\":\"white\",\"gridwidth\":2}},\"shapedefaults\":{\"line\":{\"color\":\"#2a3f5f\"}},\"annotationdefaults\":{\"arrowcolor\":\"#2a3f5f\",\"arrowhead\":0,\"arrowwidth\":1},\"geo\":{\"bgcolor\":\"white\",\"landcolor\":\"#E5ECF6\",\"subunitcolor\":\"white\",\"showland\":true,\"showlakes\":true,\"lakecolor\":\"white\"},\"title\":{\"x\":0.05},\"mapbox\":{\"style\":\"light\"}}},\"map\":{\"domain\":{\"x\":[0.0,1.0],\"y\":[0.0,1.0]},\"center\":{\"lon\":-0.12116465783030304,\"lat\":51.507209554545454},\"zoom\":9,\"style\":\"open-street-map\"},\"legend\":{\"tracegroupgap\":0,\"itemsizing\":\"constant\"},\"margin\":{\"t\":0,\"r\":0,\"l\":0,\"b\":0},\"height\":400,\"width\":800,\"mapbox\":{\"center\":{\"lon\":-0.12116465783030304,\"lat\":51.507209554545454},\"zoom\":9}}}'\nvar brexitMap = JSON.parse(brexitMapJSON)",[],[184,239],"21e702b4-efe0-11f0-b1bc-42dde27851f2","brexit_borough_barchart.js","05600394-efdf-11f0-b33d-42dde27851f2",37,["D",1768240636887],2,"// First we paste the chart data taken from our notebook using the fig.to_json() command into this pane, making sure that it is wrapped in '' quotes. So paste it into a JSON.parse('') method to convert the JSON to a JavaScript object (brexitChartData).\nvar brexitChartData = JSON.parse(\n '{\"data\":[{\"name\":\"Remain\",\"orientation\":\"h\",\"x\":{\"dtype\":\"i4\",\"bdata\":\"qNIAAL\\u002fOAQCc+gAAMx0BAKfAAABVcAEAhCYBAF0OAQAg2AAAG\\u002fYAAKtTAQDgswEANc0AAOGSAACEKgEAg+UAALjiAADZpAAAKvoAAHc4AQB82wAAxkUBAOD+AACJKgEAqF8BAPFqAQDwDAAAfxYBAO5oAQBLGwEA87kAAHKHAQBmbAAA\"},\"y\":[\"Westminster\",\"Wandsworth\",\"Waltham Forest\",\"Tower Hamlets\",\"Sutton\",\"Southwark\",\"Richmond upon Thames\",\"Redbridge\",\"Newham\",\"Merton\",\"Lewisham\",\"Lambeth\",\"Kingston upon Thames\",\"Kensington and Chelsea\",\"Islington\",\"Hounslow\",\"Hillingdon\",\"Havering\",\"Harrow\",\"Haringey\",\"Hammersmith and Fulham\",\"Hackney\",\"Greenwich\",\"Enfield\",\"Ealing\",\"Croydon\",\"City of London\",\"Camden\",\"Bromley\",\"Brent\",\"Bexley\",\"Barnet\",\"Barking and Dagenham\"],\"type\":\"bar\"},{\"name\":\"Leave\",\"orientation\":\"h\",\"x\":{\"dtype\":\"i4\",\"bdata\":\"zF4AAP2ZAABrrQAAmIkAAJnfAACJiQAAgoIAAIzmAADbwAAA6ZAAAI6SAACEdgAA4X8AAPJCAABcYgAAAdwAAOYkAQB1egEAv88AAP9kAAD2XQAAVFkAAJXLAABB7AAAieYAAI0xAQA\\u002fBAAAHl0AALJfAQDxvgAA9jsBAJftAAAytAAA\"},\"y\":[\"Westminster\",\"Wandsworth\",\"Waltham Forest\",\"Tower Hamlets\",\"Sutton\",\"Southwark\",\"Richmond upon Thames\",\"Redbridge\",\"Newham\",\"Merton\",\"Lewisham\",\"Lambeth\",\"Kingston upon Thames\",\"Kensington and Chelsea\",\"Islington\",\"Hounslow\",\"Hillingdon\",\"Havering\",\"Harrow\",\"Haringey\",\"Hammersmith and Fulham\",\"Hackney\",\"Greenwich\",\"Enfield\",\"Ealing\",\"Croydon\",\"City of London\",\"Camden\",\"Bromley\",\"Brent\",\"Bexley\",\"Barnet\",\"Barking and Dagenham\"],\"type\":\"bar\"}],\"layout\":{\"barmode\":\"group\",\"height\":800,\"margin\":{\"l\":150},\"width\":600,\"template\":{\"data\":{\"histogram2dcontour\":[{\"type\":\"histogram2dcontour\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"},\"colorscale\":[[0.0,\"#0d0887\"],[0.1111111111111111,\"#46039f\"],[0.2222222222222222,\"#7201a8\"],[0.3333333333333333,\"#9c179e\"],[0.4444444444444444,\"#bd3786\"],[0.5555555555555556,\"#d8576b\"],[0.6666666666666666,\"#ed7953\"],[0.7777777777777778,\"#fb9f3a\"],[0.8888888888888888,\"#fdca26\"],[1.0,\"#f0f921\"]]}],\"choropleth\":[{\"type\":\"choropleth\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}],\"histogram2d\":[{\"type\":\"histogram2d\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"},\"colorscale\":[[0.0,\"#0d0887\"],[0.1111111111111111,\"#46039f\"],[0.2222222222222222,\"#7201a8\"],[0.3333333333333333,\"#9c179e\"],[0.4444444444444444,\"#bd3786\"],[0.5555555555555556,\"#d8576b\"],[0.6666666666666666,\"#ed7953\"],[0.7777777777777778,\"#fb9f3a\"],[0.8888888888888888,\"#fdca26\"],[1.0,\"#f0f921\"]]}],\"heatmap\":[{\"type\":\"heatmap\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"},\"colorscale\":[[0.0,\"#0d0887\"],[0.1111111111111111,\"#46039f\"],[0.2222222222222222,\"#7201a8\"],[0.3333333333333333,\"#9c179e\"],[0.4444444444444444,\"#bd3786\"],[0.5555555555555556,\"#d8576b\"],[0.6666666666666666,\"#ed7953\"],[0.7777777777777778,\"#fb9f3a\"],[0.8888888888888888,\"#fdca26\"],[1.0,\"#f0f921\"]]}],\"contourcarpet\":[{\"type\":\"contourcarpet\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}],\"contour\":[{\"type\":\"contour\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"},\"colorscale\":[[0.0,\"#0d0887\"],[0.1111111111111111,\"#46039f\"],[0.2222222222222222,\"#7201a8\"],[0.3333333333333333,\"#9c179e\"],[0.4444444444444444,\"#bd3786\"],[0.5555555555555556,\"#d8576b\"],[0.6666666666666666,\"#ed7953\"],[0.7777777777777778,\"#fb9f3a\"],[0.8888888888888888,\"#fdca26\"],[1.0,\"#f0f921\"]]}],\"surface\":[{\"type\":\"surface\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"},\"colorscale\":[[0.0,\"#0d0887\"],[0.1111111111111111,\"#46039f\"],[0.2222222222222222,\"#7201a8\"],[0.3333333333333333,\"#9c179e\"],[0.4444444444444444,\"#bd3786\"],[0.5555555555555556,\"#d8576b\"],[0.6666666666666666,\"#ed7953\"],[0.7777777777777778,\"#fb9f3a\"],[0.8888888888888888,\"#fdca26\"],[1.0,\"#f0f921\"]]}],\"mesh3d\":[{\"type\":\"mesh3d\",\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}],\"scatter\":[{\"fillpattern\":{\"fillmode\":\"overlay\",\"size\":10,\"solidity\":0.2},\"type\":\"scatter\"}],\"parcoords\":[{\"type\":\"parcoords\",\"line\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"scatterpolargl\":[{\"type\":\"scatterpolargl\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"bar\":[{\"error_x\":{\"color\":\"#2a3f5f\"},\"error_y\":{\"color\":\"#2a3f5f\"},\"marker\":{\"line\":{\"color\":\"#E5ECF6\",\"width\":0.5},\"pattern\":{\"fillmode\":\"overlay\",\"size\":10,\"solidity\":0.2}},\"type\":\"bar\"}],\"scattergeo\":[{\"type\":\"scattergeo\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"scatterpolar\":[{\"type\":\"scatterpolar\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"histogram\":[{\"marker\":{\"pattern\":{\"fillmode\":\"overlay\",\"size\":10,\"solidity\":0.2}},\"type\":\"histogram\"}],\"scattergl\":[{\"type\":\"scattergl\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"scatter3d\":[{\"type\":\"scatter3d\",\"line\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}},\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"scattermap\":[{\"type\":\"scattermap\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"scattermapbox\":[{\"type\":\"scattermapbox\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"scatterternary\":[{\"type\":\"scatterternary\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"scattercarpet\":[{\"type\":\"scattercarpet\",\"marker\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}}}],\"carpet\":[{\"aaxis\":{\"endlinecolor\":\"#2a3f5f\",\"gridcolor\":\"white\",\"linecolor\":\"white\",\"minorgridcolor\":\"white\",\"startlinecolor\":\"#2a3f5f\"},\"baxis\":{\"endlinecolor\":\"#2a3f5f\",\"gridcolor\":\"white\",\"linecolor\":\"white\",\"minorgridcolor\":\"white\",\"startlinecolor\":\"#2a3f5f\"},\"type\":\"carpet\"}],\"table\":[{\"cells\":{\"fill\":{\"color\":\"#EBF0F8\"},\"line\":{\"color\":\"white\"}},\"header\":{\"fill\":{\"color\":\"#C8D4E3\"},\"line\":{\"color\":\"white\"}},\"type\":\"table\"}],\"barpolar\":[{\"marker\":{\"line\":{\"color\":\"#E5ECF6\",\"width\":0.5},\"pattern\":{\"fillmode\":\"overlay\",\"size\":10,\"solidity\":0.2}},\"type\":\"barpolar\"}],\"pie\":[{\"automargin\":true,\"type\":\"pie\"}]},\"layout\":{\"autotypenumbers\":\"strict\",\"colorway\":[\"#636efa\",\"#EF553B\",\"#00cc96\",\"#ab63fa\",\"#FFA15A\",\"#19d3f3\",\"#FF6692\",\"#B6E880\",\"#FF97FF\",\"#FECB52\"],\"font\":{\"color\":\"#2a3f5f\"},\"hovermode\":\"closest\",\"hoverlabel\":{\"align\":\"left\"},\"paper_bgcolor\":\"white\",\"plot_bgcolor\":\"#E5ECF6\",\"polar\":{\"bgcolor\":\"#E5ECF6\",\"angularaxis\":{\"gridcolor\":\"white\",\"linecolor\":\"white\",\"ticks\":\"\"},\"radialaxis\":{\"gridcolor\":\"white\",\"linecolor\":\"white\",\"ticks\":\"\"}},\"ternary\":{\"bgcolor\":\"#E5ECF6\",\"aaxis\":{\"gridcolor\":\"white\",\"linecolor\":\"white\",\"ticks\":\"\"},\"baxis\":{\"gridcolor\":\"white\",\"linecolor\":\"white\",\"ticks\":\"\"},\"caxis\":{\"gridcolor\":\"white\",\"linecolor\":\"white\",\"ticks\":\"\"}},\"coloraxis\":{\"colorbar\":{\"outlinewidth\":0,\"ticks\":\"\"}},\"colorscale\":{\"sequential\":[[0.0,\"#0d0887\"],[0.1111111111111111,\"#46039f\"],[0.2222222222222222,\"#7201a8\"],[0.3333333333333333,\"#9c179e\"],[0.4444444444444444,\"#bd3786\"],[0.5555555555555556,\"#d8576b\"],[0.6666666666666666,\"#ed7953\"],[0.7777777777777778,\"#fb9f3a\"],[0.8888888888888888,\"#fdca26\"],[1.0,\"#f0f921\"]],\"sequentialminus\":[[0.0,\"#0d0887\"],[0.1111111111111111,\"#46039f\"],[0.2222222222222222,\"#7201a8\"],[0.3333333333333333,\"#9c179e\"],[0.4444444444444444,\"#bd3786\"],[0.5555555555555556,\"#d8576b\"],[0.6666666666666666,\"#ed7953\"],[0.7777777777777778,\"#fb9f3a\"],[0.8888888888888888,\"#fdca26\"],[1.0,\"#f0f921\"]],\"diverging\":[[0,\"#8e0152\"],[0.1,\"#c51b7d\"],[0.2,\"#de77ae\"],[0.3,\"#f1b6da\"],[0.4,\"#fde0ef\"],[0.5,\"#f7f7f7\"],[0.6,\"#e6f5d0\"],[0.7,\"#b8e186\"],[0.8,\"#7fbc41\"],[0.9,\"#4d9221\"],[1,\"#276419\"]]},\"xaxis\":{\"gridcolor\":\"white\",\"linecolor\":\"white\",\"ticks\":\"\",\"title\":{\"standoff\":15},\"zerolinecolor\":\"white\",\"automargin\":true,\"zerolinewidth\":2},\"yaxis\":{\"gridcolor\":\"white\",\"linecolor\":\"white\",\"ticks\":\"\",\"title\":{\"standoff\":15},\"zerolinecolor\":\"white\",\"automargin\":true,\"zerolinewidth\":2},\"scene\":{\"xaxis\":{\"backgroundcolor\":\"#E5ECF6\",\"gridcolor\":\"white\",\"linecolor\":\"white\",\"showbackground\":true,\"ticks\":\"\",\"zerolinecolor\":\"white\",\"gridwidth\":2},\"yaxis\":{\"backgroundcolor\":\"#E5ECF6\",\"gridcolor\":\"white\",\"linecolor\":\"white\",\"showbackground\":true,\"ticks\":\"\",\"zerolinecolor\":\"white\",\"gridwidth\":2},\"zaxis\":{\"backgroundcolor\":\"#E5ECF6\",\"gridcolor\":\"white\",\"linecolor\":\"white\",\"showbackground\":true,\"ticks\":\"\",\"zerolinecolor\":\"white\",\"gridwidth\":2}},\"shapedefaults\":{\"line\":{\"color\":\"#2a3f5f\"}},\"annotationdefaults\":{\"arrowcolor\":\"#2a3f5f\",\"arrowhead\":0,\"arrowwidth\":1},\"geo\":{\"bgcolor\":\"white\",\"landcolor\":\"#E5ECF6\",\"subunitcolor\":\"white\",\"showland\":true,\"showlakes\":true,\"lakecolor\":\"white\"},\"title\":{\"x\":0.05},\"mapbox\":{\"style\":\"light\"}}}}}',\n);",[],[184,248],["D",1767979955823],[211,212],[184],["D",1767980184425],[],[190],["D",1767980177865],[],[195],["D",1767979955823],{"_11":12,"_90":86},{"_11":12,"_84":-5,"_85":86,"_46":47,"_87":88,"_89":40},{"_29":30,"_13":26,"_20":21,"_27":28,"_31":32,"_33":34,"_78":42,"_79":80,"_81":57,"_82":14,"_83":12},"ctx",{"_71":-5,"_114":302,"_303":304,"_305":306,"_307":40,"_308":40,"_309":40,"_310":51,"_311":-5,"_312":-7,"_313":-7,"_314":55,"_315":40,"_316":40,"_317":-5,"_318":40,"_319":40,"_320":40,"_321":-5},"ENV",{"_273":274,"_275":276,"_277":26,"_278":279,"_280":281,"_282":283,"_284":285,"_286":287,"_288":289,"_290":291,"_292":293,"_294":295,"_296":297,"_298":299,"_300":301},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Visualizing London's Brexit vote

UCL dataviz 2026

Flexbox foursome

Notes

Remain vs Leave votes for the London Boroughs

Notes

Mapping Brexit London

Notes

Notes

Branches1

Branches
1