-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
562 lines (517 loc) · 28 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
<!DOCTYPE html>
<html lang="en-GB">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover"/>
<meta charset="utf-8">
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@traffordDataLab" />
<meta name="twitter:title" content="Trafford ward profiler" />
<meta name="twitter:description" content="Interactively visualise indicators for the Trafford's wards categorised by theme" />
<meta name="twitter:image" content="https://www.trafforddatalab.io/ward_profiler/twitter-card.png" />
<meta name="twitter:image:alt" content="Partial view of the choropleth and lollypop chart from the Trafford ward profiler" />
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans|Roboto"/>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css" integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg" crossorigin="anonymous">
<title id="pageTitle">Trafford ward profiler</title>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3-legend/2.24.0/d3-legend.js"></script>
<script src="https://www.trafforddatalab.io/assets/javascript/labGetQryStrValByKey.js"></script>
<script src="d3/choropleth.js"></script>
<script src="d3/lollypopChart.js"></script>
<style>
a
{
color: #046dc3;
text-decoration: none;
}
a:hover
{
text-decoration: underline;
}
h3
{
color: #757575;
padding-top:0px;
margin:0;
}
@font-face
{
font-family: 'Roboto', sans-serif;
src: url("https://fonts.googleapis.com/css?family=Open+Sans|Roboto'");
}
h3, .placeLabel, .legend, .legendTitle, #bestFitLegend, #datasetDescription, #description, #download,
.header, .choroTitle, .choroSubtitle, .choroSource, .choroNote, .valueLabel, .tickLabel
{
font-family: 'Roboto', sans-serif;
}
.header
{
font-size: 20px;
color: #757575;
cursor: pointer;
}
#headerTitle
{
float: left;
display: inline-block;
padding-top: 10px;
padding-left: 10px;
}
#labLogo
{
float: left;
display: inline-block;
}
#main
{
border-top: 1px solid #ccc;
}
#bestFitMap
{
max-width: 100%;
position: fixed;
top: 10px;
left: 10px;
right:10px;
bottom:10px;
background-color: white;
overflow-y: auto;
padding: 0 30px 0 12px;
box-shadow: 0px 0px 3px 3px #757575;
}
#closeBotton
{
position: fixed;
top: 15px;
left: 20px;
font-size: 25px;
color: #757575;
text-align: center;
cursor: pointer;
}
.boundary
{
fill: white;
stroke: #757575;
stroke-opacity: 0.5;
stroke-width: 1px;
stroke-linejoin: round;
}
.circle{
stroke:#757575;
}
.tickLabel{
fill:#757575;
}
.legend
{
font-size: 11px;
fill: #757575
}
.legendTitle
{
font-size: 12px;
fill: #757575
}
#theme{
float:left;
padding: 10px 5px 10px 0px;
}
#dataset
{
float:left;
padding-top: 10px;
padding-bottom: 10px;
overflow-x: hidden;
}
#mapContainer
{
width:50%;
float:left;
text-align: center;
}
#map, #bar
{
width: 90%;
display: inline-block;
}
#barCointainer
{
width:50%;
float:right;
text-align: center;
}
#bestFitLegend
{
font-size: 12px;
color: black;
padding: 10px 3.3% 0px 3.3%;
}
#datasetDescription
{
font-size: 16px;
color: black;
clear: both;
padding: 10px 3.3% 10px 3.3%;
}
#description
{
text-align: left;
padding-right: 20px;
}
#description p
{
font-size: 12px;
}
#download
{
padding: 10px 3.3% 0px 3.3%;
font-size: 12px;
}
.labButton
{
background-color: #757575;
color: #fff;
padding: 3px 5px 3px 5px;
margin: 0 0 7px 10px;
border-radius: 3px;
display: inline-block;
}
.labButton:hover, .labBorder:hover
{
border: 1px solid #5d77a3;
box-shadow: 0 0 5px #5d77a3;
}
.clearb
{
clear: both;
}
.hidden
{
display: none;
}
.visible
{
display:block;
}
.eight0
{
width: 90%;
text-align: center;
}
_:-ms-fullscreen, :root #map, #bar{
height:35vw;
}
@media (max-width:800px)
{
#mapContainer, #barCointainer
{
width:100%;
}
#map, #bar
{
width:100%;
}
#theme, #dataset
{
padding-top: 0px;
padding-bottom: 0px;
max-width: 100%;
}
#datasetSelect
{
max-width: 100%;
text-overflow: ellipsis;
}
#bestFitLegend, #description
{
padding: 10px 0px 10px 0px;
}
#datasetDescription, #bestFitLegend, #download
{
padding-left: 0px;
}
}
</style>
</head>
<body onclick="clickEvent(event)">
<div class="header clearb">
<div class="clearb" onclick="initialPage()">
<div id="labLogo"><a href="https://www.trafforddatalab.io/index.html" target="_blank"><img src="https://www.trafforddatalab.io/assets/logo/trafforddatalab_logo.svg" alt="Trafford Data Lab" width="93" height="31" class="traffordDataLabLogo"/></a></div>
<div id="headerTitle" onclick="initialPage()">Trafford ward profiler</div>
</div>
</div>
<div id="main" class="clearb">
<div id="theme"></div>
<div id="dataset"></div>
<div class="clearb">
<div id="datasetDescription" class="clearb"></div>
<div id="mapContainer">
<div id="map"></div>
</div>
<div id="barCointainer">
<div id="description" class="clearb"></div>
<div id="bar"></div>
</div>
</div>
<div id="bestFitLegend" class="clearb hidden">Note: The figures displayed correspond to data aggregated from the <a href="https://www.trafforddatalab.io/analysis/wards2023/Best-fit_OA_Ward2023.html" target="_blank">best-fit OAs to the Ward</a> according to the ONS.<br>Census data is subject to <a href="https://www.ons.gov.uk/peoplepopulationandcommunity/populationandmigration/populationestimates/methodologies/protectingpersonaldataincensus2021results" target="_blank">Statistical disclosure control</a> to avoid the release of confidential data. Totals may not sum due to the disclosure control applied.</div>
<div id="download" class="clearb"></div>
</div>
<script type="text/javascript">
window.onpopstate = function(event) {
window.location.reload(true)
};
themeUrls=[{theme:"Communications", url:"https://www.trafforddatalab.io/ward_data/communications/meta.csv"},
//{theme:"Community safety", url:"https://www.trafforddatalab.io/ward_data/community_safety/meta.csv"},
{theme:"Demographics", url:"https://www.trafforddatalab.io/ward_data/demographics/meta.csv"},
{theme:"Deprivation", url:"https://www.trafforddatalab.io/ward_data/deprivation/meta.csv"},
//{theme:"Economy", url:"https://www.trafforddatalab.io/ward_data/economy/meta.csv"},
{theme:"Education", url:"https://www.trafforddatalab.io/ward_data/education/meta.csv"},
//{theme:"Environment", url:"https://www.trafforddatalab.io/ward_data/environment/meta.csv"},
{theme:"Governance", url:"https://www.trafforddatalab.io/ward_data/governance/meta.csv"},
{theme:"Health", url:"https://www.trafforddatalab.io/ward_data/health/meta.csv"},
{theme:"Housing", url:"https://www.trafforddatalab.io/ward_data/housing/meta.csv"},
//{theme:"Labour market", url:"https://www.trafforddatalab.io/ward_data/labour_market/meta.csv"},
{theme:"Transport", url:"https://www.trafforddatalab.io/ward_data/transport/meta.csv"}
]
currentTheme = ""
var currentDatasetList=[]
//Load geojson and create the theme selector
var geoJsonUrl="https://www.trafforddatalab.io/spatial_data/ward/2023/trafford_ward_super_generalised.geojson"
d3.json(geoJsonUrl, function (error, json1) {
json=json1;
themeSelector()
readURLData()
})
function themeSelector(){
var selectTheme = '<select id="selectTheme" name="selectTheme" onChange="themeDataset(this.value)"><option value="{}">Select a Theme</option>';
for (var i = 0; i < themeUrls.length; i++) {
selectTheme += '<option value="' + i + '"';
selectTheme += '>' + themeUrls[i].theme + '</option>';
}
selectTheme += '</select>';
document.getElementById("theme").innerHTML = selectTheme;
}
//Create a selector with the datasets of the selected theme
function themeDataset(val){
var name = themeUrls[+val].theme
var url = themeUrls[+val].url
currentTheme=name;
d3.csv(url, function(error, data) {
currentDatasetList=data;
popSelect(data,'dataset','callChoro')
})
}
function popSelect(data,container,onChangeFun) {
var select = '<select id="datasetSelect" name="selectDataset" onChange="' + onChangeFun + '(this.value)"><option value="{}">Select a ' + container + '</option>';
for (var i = 0; i < data.length; i++) {
select += '<option value="'+ i + '"';
select += '>' + data[i].indicator + '</option>';
}
select += '</select>';
document.getElementById(container).innerHTML = select;
}
//plot Choropleth and lollypop Chart
function callChoro(index){
if (index!= "{}"){
var name = currentDatasetList[+index]["indicator"];
var url = currentDatasetList[+index]["data"];
var urlCode = currentDatasetList[+index]["code"];
var geography = currentDatasetList[+index]["geography"];
var description = currentDatasetList[+index]["description"]
var source = currentDatasetList[+index]["source"]
var period = currentDatasetList[+index]["period"]
d3.csv(url, function(error, data) {
if (geography == "Best-fit ward"){
document.getElementById("bestFitLegend").classList.add("visible");
}
else if (geography == "Electoral ward"){
document.getElementById("bestFitLegend").classList.remove("visible");
}
var measure = data[0].measure;
var data = data.filter(a=>a.measure==measure);
for (var i = 0; i < data.length; i++) {
var code = data[i].area_code;
var value = parseFloat(data[i].value);
for (var j = 0; j < json.features.length; j++) {
var jsonCode = json.features[j].properties.area_code;
if (code == jsonCode) {
json.features[j].properties.value = value;
break;
}
}
}
document.getElementById("map").innerHTML=""
document.getElementById("bar").innerHTML=""
document.getElementById("description").innerHTML=""
var objChoro={data:json,
container:"#map",
title:name,
subtitle:period,
clickFunction:highlightArea,
legendTitle:data[1]['measure'],
source:source,
palette:["#bcd2e8", "#9dc0d7", "#6c9cba", "#417196", "#1e3f66"]
}
choro(objChoro)
var objLPC={data:data,
container:"#bar",
clickFunction:highlightArea,
palette:["#bcd2e8", "#9dc0d7", "#6c9cba", "#417196", "#1e3f66"]
}
lollypopChart(objLPC)
document.getElementById("datasetDescription").innerHTML=description
//create download button
document.getElementById("download").innerHTML='Download <a class="labButton" href="'+ url +'" download>Data</a><a class="labButton" href="'+ urlCode +'" download>R code</a>'
document.getElementById("pageTitle").innerHTML="Trafford ward profiler:"+name
var newurl = window.location.protocol + "//" + window.location.host + window.location.pathname + '?theme=' + encodeURIComponent(currentTheme) + '&name=' + encodeURIComponent(name);
window.history.pushState({path:newurl},'',newurl);
})
}
}
function highlightArea(b,d){
clearSelection()
var elems=document.getElementsByClassName(d.area_code)
for (var i = 0; i<elems.length; i++) {
if(elems[i].tagName=="path"){
elems[i].style.stroke= "black";
elems[i].style.strokeWidth= "3px";
elems[i].parentNode.appendChild(elems[i])
}
if(elems[i].tagName=="text"){
elems[i].style.fill= "black";
}
if(elems[i].tagName=="circle"){
elems[i].style.stroke= "black";
elems[i].style.strokeWidth= "3px";;
}
if(elems[i].tagName=="line"){
elems[i].style.stroke= "black";
}
}
}
function clearSelection(){
var elems=document.getElementsByClassName("boundary")
for (var i = 0; i<elems.length; i++) {
elems[i].style.stroke= "#757575";
elems[i].style.strokeWidth= "1px";
}
var elems=document.getElementsByClassName("circle")
for (var i = 0; i<elems.length; i++) {
elems[i].style.stroke= "#757575";
elems[i].style.strokeWidth= "1px";
}
var elems=document.getElementsByClassName("tickLabel")
for (var i = 0; i<elems.length; i++) {
elems[i].style.fill = "#757575";
}
var elems=document.getElementsByClassName("stick")
for (var i = 0; i<elems.length; i++) {
elems[i].style.stroke = "#ccc";
}
}
//load svg's of Wards and map selector
function initialPage(){
document.getElementById("pageTitle").innerHTML="Trafford ward profiler"
var newurl = window.location.protocol + "//" + window.location.host + window.location.pathname
window.history.pushState({path:newurl},'',newurl);
document.getElementById("selectTheme").selectedIndex = 0;
document.getElementById('selectTheme').value = '{}';
document.getElementById("map").innerHTML=""
document.getElementById("dataset").innerHTML=""
document.getElementById("datasetDescription").innerHTML=""
document.getElementById("bestFitLegend").classList.remove("visible");
document.getElementById("download").innerHTML=""
var width = 600;
var height = 560;
var svg = d3.select("#map")
.append("svg")
.attr("viewBox", "0 0 " + width + " " + height)
.attr("preserveAspectRatio", "xMinYMin meet")
var projection = d3.geoMercator()
.center([ -2.35533605967, 53.4190090526 ])
.translate([width/2, height/2])
.scale([width * 200]);
var path = d3.geoPath()
.projection(projection);
svg.selectAll("path")
.data(json.features)
.enter()
.append("path")
.attr("d", path)
.attr("class", function(d) {return "boundary " + d.properties.area_name} )
.on("click", function(d) {
d3.select(this).call(plotSVG,d.properties)
})
plotSVG([],{area_name:"Old Trafford"})
}
function plotSVG(b,d){
var elems=document.getElementsByClassName("boundary")
for (var i = 0; i<elems.length; i++) {
elems[i].style.fill= "white"
}
var elems=document.getElementsByClassName(d.area_name)
for (var i = 0; i<elems.length; i++) {
if(elems[i].tagName=="path"){
elems[i].style.fill= "#5d77a3";
elems[i].parentNode.appendChild(elems[i])
}
} var nameObj = {"Altrincham":{slugName:"Altrincham", description:"Altrincham is a sub-regional shopping centre, and Trafford's largest town. It's at the hub of south Manchester's modern transport infrastructure, complemented by an integrated rail, Metrolink and bus Interchange, which has undergone redevelopment. It also acts as the commercial centre for the area, providing extensive office accommodation. It has an historic market quarter, which regeneration works continue to modernise and upgrade. Major developments to taken place within the ward including a multi-million-pound refurbishment of Altrincham Leisure Centre, public realm improvements, revitalising the Stamford Quarter and The Grafton Centre."},
"Ashton upon Mersey":{slugName:"Ashton_upon_Mersey", description:"Ashton upon Mersey is densely populated, and the majority of land is under private ownership, including the golf course and sports facilities. There is a great deal of green space, which provides opportunities for residents to access a number of recreational activities. It is a pleasant village with a variety of shops, pubs and restaurants. The boundary of this ward follows the River Mersey and the Carrington Spur, with paths running through and adjacent to the private sites providing links to the Trans Pennine Trail."},
"Bowdon":{slugName:"Bowdon", description:"Bowdon is the largest ward in Trafford and is a combination of several small, rural villages surrounded by open countryside. This includes Dunham Massey Country Park and more densely populated residential areas. The majority of the ward is owned by the National Trust as part of the Dunham Massey Estate, which is a fantastic asset for the residents of the borough. The Estate includes Dunham Massey Hall and a deer park, while the parish of Dunham Massey itself boasts 48 listed buildings. Bowdon is a semi-rural ward and has a low population density."},
"Broadheath":{slugName:"Broadheath", description:"Broadheath has a mix of land uses. To the south the Bridgewater Canal, industrial and retail areas, to the north a relatively new housing development known as Stamford Brook. To the west it has agricultural areas with views across to Warburton and Dunham and, to the east, residential areas of Timperley."},
"Brooklands":{slugName:"Brooklands", description:"Brooklands is a ward within the Sale area. It is a very attractive and affluent place to live, bounded by the A56 to the west and by Baguley Brook to the south. It has two distinct areas which are separated by the Bridgewater Canal and the Metrolink line. Brooklands ward has a Metrolink station and is the home of Sale Amateur Rugby Club. The area includes two parks, Walton Park to the west and Moor Nook to the east. Walton Park has a miniature railway, play areas, tennis courts, bowling greens and football pitches."},
"Bucklow-St Martins":{slugName:"Bucklow-St_Martins", description:"Bucklow-St Martins is the second largest ward in the borough in terms of area. It is characterised by large areas of agricultural land, as well as Carrington Moss. Within the ward are a large industrial complex and Carrington Business Park. Within the south east part of the ward are the villages of Carrington and Partington, both of which have their own parish councils. The northern boundary of the site is bounded by the River Mersey. The ward is home to the Manchester United Football Club training grounds."},
"Davyhulme":{slugName:"Davyhulme", description:"Davyhulme is bounded by the Manchester Ship Canal to the west, Davyhulme waste water treatment works to the north and residential areas of Davyhulme and Flixton to the east and south. The ward is mainly residential, with large areas of private open land along the canal edge. Trafford General Hospital – the birthplace of the NHS – is located in this ward."},
"Flixton":{slugName:"Flixton", description:"Flixton is bounded by the Mersey Valley and the River Mersey to the south and is traversed by the Manchester to Liverpool railway line. Its population is concentrated in areas in the northern half of the ward; other areas are generally open. Flixton House, a late 18th-century Grade II listed building owned by the Council, is in the ward. It is now a popular wedding and events venue."},
"Gorse Hill & Cornbrook":{slugName:"Gorse_Hill_&_Cornbrook", description:"This is the northern most ward in Trafford. It is the third largest ward in area size and contains most of Trafford Park Industrial Estate. The majority of population are located within the ward's southern and eastern edge. The residential neighbourhoods within this area include the northern tip of Stretford in the south, together with Gorse Hill itself and Cornbrook in the eastern side. The ward is home to Manchester United Football Club and Lancashire Cricket Club, as well as Trafford Town Hall. The Media City development located on the Salford side of the Canal involving the BBC is generating significant development on the Trafford side, and Gorse Hill is also home to the iconic Coronation Street studio. Trafford Park railway station serves the ward for commuting to and from both Manchester and Liverpool."},
"Hale Barns & Timperley South":{slugName:"Hale_Barns_&_Timperley_South", description:"Hale Barns & Timperley South lies at the southern tip of the borough. It is bounded to the east by the M56, to the south by the River Bollin, by the residential areas of Hale to the west and Timperley Central to the north. The ward contains a large amount of agricultural land including two private golf courses. There is also a number of private sports clubs within the ward providing facilities for tennis, bowling and football. It is generally considered to be an affluent ward in the top 10% wealthiest areas in England. Hale Barns has a good motorway network and is convenient for Manchester Airport, which is just a few miles away. The ward is diverse in nature and is home to large Jewish and Muslim community groups."},
"Hale":{slugName:"Hale", description:"Hale is a densely populated ward located to the south east of Altrincham town centre. It is bounded to the south by the River Bollin, to the north by Altrincham Golf Course and by the residential areas of Hale Barns and Bowdon to the east and west. The heart of the ward is Hale village which enjoys a good variety of independent shops and fashionable bars and restaurants."},
"Longford":{slugName:"Longford", description:"Longford is bounded to the south by the River Mersey, to the west by the A56 Chester Road and to the north by the Metrolink line; Manchester lies to the southeast and Old Trafford to the north east. Longford is a densely populated urban area in north-east of the borough. Longford Park, one of the borough's larger parks. Longford Athletics stadium can also be found adjacent to the park."},
"Lostock & Barton":{slugName:"Lostock_&_Barton", description:"Lostock & Barton is in the north of Trafford and is bounded to the north by the Manchester Ship Canal and the Bridgewater Canal. The ward is home to the Trafford Centre, separated from the residential areas by the M60, the historical Barton Aqueduct – which crosses the Manchester Ship Canal – and Barton Swing Bridge. The area has also benefitted from a new housing development and shops."},
"Old Trafford":{slugName:"Old_Trafford", description:"Old Trafford is a small and densely populated ward at the north east tip of the borough bordering Hulme in Manchester to the east and Whalley Range to the south. Physically it is characterised by dense residential areas of Victorian terraced housing and a diverse range of housing stock. Old Trafford is also known for its very diverse population, vibrant communities and active community groups, some are established and there are some newer groups. Old Trafford is undergoing significant transformation with the Old Trafford Master Plan and there is a lot of change to current housing."},
"Sale Central":{slugName:"Sale_Central", description:"Sale Central ward is home to Sale Town Centre, Sale Waterside and the Town Hall and Sale Water Park with its Water Sports Centre. Worthington Park, Walkden Gardens, and Priory Woods are situated in the ward. It is bounded to the north by the River Mersey and to the east by the residential areas of Sale Moor; Ashton upon Mersey lies to the west and Brooklands to the south. The M60 motorway, A56 Chester Road and the Bridgewater Canal all run through the ward."},
"Sale Moor":{slugName:"Sale_Moor", description:"Sale Moor is situated to the east of the borough and shares a large part of its boundary with Manchester. Its northern boundary is the River Mersey and Sale Golf Course. The remaining boundaries are adjacent to residential areas on Northern Moor in Manchester and Sale Central. The M60 motorway runs through the ward and separates the main residential area from Sale Golf Course and the Mersey Valley."},
"Manor":{slugName:"Manor", description:"Manor is densely populated and suburban in character. The eastern boundary is the A56 (Washway Road), the western boundary is Dainewell Woods and Carrington Moss. The northern boundary is the residential areas of Ashton upon Mersey, and Broadheath lie to the south. Manor is a new ward, created in 2023 following changes to the boundaries of the electoral wards."},
"Stretford & Humphrey Park":{slugName:"Stretford_&_Humphrey_Park", description:"Stretford is a densely populated ward. The M60 motorway runs through the ward and is the boundary to the west. The River Mersey – the historical boundary between Lancashire and Cheshire – is the southern boundary and the M56 (Chester Road) is the eastern boundary. The ward contains Stretford Town Centre and Stretford Mall. The majority of the ward is greenbelt land and forms part of the Mersey Valley. To the south west of the ward lie Kickety Brook and the Stretford Meadows, providing a natural habitat for wildlife. The Trans Pennine Trail runs alongside the brook providing a pleasant walking environment. Trafford Council approved the Stretford Town Centre Masterplan in January 2018. The Masterplan provides a bold vision for delivering transformational change to Stretford Town Centre and represents a significant step forward in setting out a route to securing a sustainable economic future for the town centre. It will provide a framework for delivering the successful regeneration of Stretford Town Centre over the next 10 to 15 years."},
"Timperley North":{slugName:"Timperley_North", description:"Timperley North is primarily a residential area in the south of the borough. The ward is on the eastern boundary of the borough adjoining Manchester along Brooklands Road. It is bounded to the west by the Bridgewater Canal and to the north by Baguley Brook. The southern boundary is the Manchester to Chester railway line and beyond are the residential areas of Timperley Central."},
"Urmston":{slugName:"Urmston", description:"Urmston is situated in the heart of the northern part of the borough. It is split into two residential areas by the Manchester to Liverpool railway line. The Mersey Valley and the River Mersey form the southern boundary, with the residential areas of Stretford to the east and Flixton to the west. Within the ward are Urmston Town Centre, Urmston train station and one of the five cemeteries of the borough."},
"Timperley Central":{slugName:"Timperley_Central", description:"At the northern boundary is the Manchester to Chester railway line, the western boundary is Timperley brook. The A560 is part of the south boundary and the Fairywell Brook at the west is the boundary with Manchester. The busy Timperley district shopping centre is situated at the heart of the ward. There, you will find a statue of Frank Sidebottom, the comic creation of Chris Sievey."}}
document.getElementById("bar").innerHTML='<div class="eight0" ><object width="70%" type="image/svg+xml" data="figures/' + nameObj[d.area_name]["slugName"] + '.svg"></object></div>'
document.getElementById("description").innerHTML="<h3>" + d.area_name + "</h3><p>" + nameObj[d.area_name]["description"] + "</p>"
}
function readURLData(){
var theme=labGetQryStrValByKey("theme")
var dataset=labGetQryStrValByKey("name")
if (typeof theme == "string"){
for (var i = 0; i < themeUrls.length; i++) {
if(theme == themeUrls[i].theme){
document.getElementById("selectTheme").selectedIndex = i;
document.getElementById('selectTheme').value = i.toString();
d3.csv(themeUrls[i].url, function(error, data) {
currentDatasetList=data;
for (var j = 0; j < data.length; j++) {
if(dataset == data[j].indicator){
currentTheme=theme
callChoro(j)
popSelect(data,'dataset','callChoro')
document.getElementById("datasetSelect").selectedIndex = j;
document.getElementById('datasetSelect').value = j.toString();
break;
}
}
})
break;
}
}
}else{
initialPage()
}
}
function clickEvent(event) {
if (event.target.nodeName=="svg"){
clearSelection()
}
}
</script>
</body>
</html>