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",[162],"2fe614ce-ed81-11f0-8651-42dde27851f2","favicon.svg","019ba3d1-3692-777d-9915-48d11ed2e0dd",["D",1767979955823],"",[168],"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.",[174],"2fe5e6ca-ed81-11f0-8651-42dde27851f2","scripts","019ba3d1-3692-777d-9915-403dec48afd7",["D",1767979955823],"directory",[180],"b828c912-ed81-11f0-8439-42dde27851f2","images","b693b878-ed81-11f0-8276-42dde27851f2",["D",1767980184425],[186],"b439d846-ed81-11f0-b5c9-42dde27851f2","data","b2d5764a-ed81-11f0-a274-42dde27851f2",["D",1767980177865],[191],"pulls","branches","forks","envVars",{"_202":41,"_204":41},"connections",{"_202":41,"_203":41},"count","unfilledCount","emptyCount",{"_18":190,"_20":191,"_131":192,"_133":-5,"_134":67,"_135":72,"_137":37,"_22":259,"_64":139,"_140":183,"_141":-5,"_143":26,"_144":-5,"_217":260,"_87":261},{"_18":185,"_20":186,"_131":187,"_133":-5,"_134":67,"_135":157,"_137":37,"_22":256,"_64":139,"_140":183,"_141":-5,"_143":26,"_144":-5,"_217":257,"_87":258},{"_18":179,"_20":180,"_131":181,"_133":-5,"_134":67,"_135":139,"_137":37,"_22":253,"_64":41,"_140":183,"_141":-5,"_143":26,"_144":-5,"_217":254,"_87":255},{"_18":244,"_20":245,"_131":246,"_133":181,"_134":67,"_135":247,"_137":37,"_22":248,"_64":249,"_140":158,"_141":250,"_143":26,"_144":-5,"_217":251,"_87":252},{"_18":235,"_20":236,"_131":237,"_133":181,"_134":67,"_135":238,"_137":37,"_22":239,"_64":240,"_140":158,"_141":241,"_143":26,"_144":-5,"_217":242,"_87":243},{"_18":173,"_20":174,"_131":175,"_133":-5,"_134":67,"_135":139,"_137":37,"_22":232,"_64":41,"_140":98,"_141":177,"_143":26,"_144":-5,"_217":233,"_87":234},{"_18":167,"_20":168,"_131":169,"_133":-5,"_134":67,"_135":139,"_137":37,"_22":229,"_64":41,"_140":98,"_141":171,"_143":26,"_144":-5,"_217":230,"_87":231},{"_18":161,"_20":162,"_131":163,"_133":-5,"_134":67,"_135":65,"_137":37,"_22":226,"_64":136,"_140":98,"_141":165,"_143":26,"_144":-5,"_217":227,"_87":228},{"_18":152,"_20":153,"_131":154,"_133":-5,"_134":67,"_135":155,"_137":37,"_22":223,"_64":157,"_140":158,"_141":159,"_143":26,"_144":-5,"_217":224,"_87":225},{"_18":146,"_20":147,"_131":35,"_133":-5,"_134":67,"_135":139,"_137":37,"_22":220,"_64":41,"_140":149,"_141":150,"_143":26,"_144":-5,"_217":221,"_87":222},{"_18":129,"_20":130,"_131":132,"_133":-5,"_134":67,"_135":136,"_137":37,"_22":216,"_64":139,"_140":98,"_141":142,"_143":26,"_144":-5,"_217":218,"_87":219},["D",1767982896978],"children",[],[130],["D",1767979955823],[],[147],["D",1768240645599],[],[153],["D",1768240705303],[],[162],["D",1767979955823],[],[168],["D",1767979955823],[],[174],"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)",[],[180,236],"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);",[],[180,245],["D",1767979955823],[208,209],[180],["D",1767980184425],[],[186],["D",1767980177865],[],[191],["D",1767979955823],{"_16":17,"_85":81},{"_16":17,"_79":-5,"_80":81,"_32":33,"_82":83,"_84":26},{"_64":65,"_20":66,"_18":67,"_68":19,"_69":70,"_71":72,"_73":28,"_74":75,"_76":43,"_77":21,"_78":17},"ctx",{"_57":-5,"_108":299,"_300":301,"_302":303,"_304":26,"_305":26,"_306":26,"_307":37,"_308":-5,"_309":-7,"_310":-7,"_311":41,"_312":26,"_313":26,"_314":-5,"_315":26,"_316":26,"_317":26,"_318":-5},"ENV",{"_270":271,"_272":273,"_274":66,"_275":276,"_277":278,"_279":280,"_281":282,"_283":284,"_285":286,"_287":288,"_289":290,"_291":292,"_293":294,"_295":296,"_297":298},"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

Search