script type text javascript src https d3js org d3 v7 min js script script let dataurl https raw githubusercontent com tomwhite covid 19 uk data master data covid 19 cases uk csv Format Date Country AreaCode Area TotalCases 2020 01 30 England E06000014 York 1 2020 02 03 England E10000002 Buckinghamshire 1 async const leftmargin 20 const topmargin 20 const width 400 const height 400 let data await d3 csv dataurl function d const area d Area const totalcases parseInt d TotalCases const date d Date new Date d Date getTime if area Buckinghamshire return data push area area totalcases totalcases date date console log data data length var svg d3 select body append svg attr width width attr height height attr transform translate leftmargin topmargin append g Define x axis and y axis let x d3 scaleBand domain data map function d return d date range 0 width padding 0 3 let y d3 scaleLinear domain d3 extent data d d totalcases range height 0 Bars svg selectAll mybar data data enter append rect attr x function d return x d date attr y function d return y d totalcases attr width x bandwidth attr height function d return height y d totalcases attr fill 69b3a2 document body style height 500px console log ready script script type text javascript src https d3js org d3 v7 min js script script let dataurl https raw githubusercontent com tomwhite covid 19 uk data master data covid 19 cases uk csv Format Date Country AreaCode Area TotalCases 2020 01 30 England E06000014 York 1 2020 02 03 England E10000002 Buckinghamshire 1 async const leftmargin 200 const topmargin 200 const width 400 const height 400 let datain await d3 csv dataurl function d const area d Country let totalcases parseInt d TotalCases if d TotalCases NaN totalcases 100 const date d Date new Date d Date getTime if area in datain datain area totalcases else datain area totalcases var data for var key in datain data push name key value datain key console log data console log data data length generate range of colors based on the data var myColor d3 scaleOrdinal domain data range d3 schemeSet3 var pie d3 pie value function d return d value var piedata pie data var svg d3 select body append svg attr width width attr height height append g attr transform translate leftmargin topmargin var txt d3 select body append div style position absolute style left 10px style top 10px style font size 200 text d return svg selectAll mySlices data piedata enter append path attr d d3 arc innerRadius width 0 1 outerRadius width 0 5 attr fill function d return myColor d value on mouseover function d i k d3 select this transition duration 50 attr opacity 55 txt html d return i data name br i data value on mouseout function d i d3 select this transition duration 50 attr opacity 0 75 attr stroke black style stroke width 1px document body style height 600px console log ready script script type text javascript src https d3js org d3 v7 min js script script src https d3js org topojson v1 min js script style feature fill 777 mesh fill none stroke 000 stroke width 2px stroke linejoin round style script async let dataurl https notebook xbdev net var scripts covid_ltla_2021 11 17 csv Format areaCode areaName areaType date cumCasesByPublishDate E06000003 Redcar and Cleveland utla 2021 11 17 23540 E06000014 York utla 2021 11 17 27512 let datain await d3 csv dataurl function d const area d areaName const areacode d areaCode let totalcases parseInt d cumCasesByPublishDate if d TotalCases NaN totalcases 100 const date d Date new Date d Date getTime if areacode in datain datain areacode totalcases totalcases else datain areacode totalcases totalcases let datamap Object values datain map function item return item totalcases let datarange d3 extent datamap console log datarange datarange Create a map of the UK use areacodes associate numbers values let mapurl https raw githubusercontent com martinjc UK GeoJSON master json administrative gb topo_lad json let data await fetch mapurl let uk await data json topojson feature county county objects counties features let mapFeatures for let key in uk objects mapFeatures topojson feature uk uk objects key features break var width 600 height 800 var projection d3 geoAlbers center 0 55 4 rotate 4 4 0 parallels 50 60 scale 800 5 translate width 2 height 2 var path d3 geoPath projection projection var svg d3 select body append svg attr width width attr height height var myColors d3 scaleLinear range yellow blue unknown ccc console log myColors 10 1 svg selectAll subunit data mapFeatures enter append path attr class feature attr d path style fill function d i k console log d properties LAD13NM get areacode or areaname if d id S12000036 return red const areacode d id if areacode in datain return myColors datain areacode totalcases datarange 1 return white return blue append svg title attr transform function d return translate path centroid d attr dy 35em text function d var name d properties LAD13NM var areacode d id if areacode in datain name datain areacode totalcases return name document body style height 800px script
tion 50 attr opacity 55 txt html d return i data name br i data value on mouseout function d i d3 select this transition duration 50 attr opacity 0 75 attr stroke black style stroke width 1px document body style height 600px console log ready script script type text javascript src https d3js org d3 v7 min js script script src https d3js org topojson v1 min js script style feature fill 777 mesh fill none stroke 000 stroke width 2px stroke linejoin round style script async let dataurl https notebook xbdev net var scripts covid_ltla_2021 11 17 csv Format areaCode areaName areaType date cumCasesByPublishDate E06000003 Redcar and Cleveland utla 2021 11 17 23540 E06000014 York utla 2021 11 17 27512 let datain await d3 csv dataurl function d const area d areaName const areacode d areaCode let totalcases parseInt d cumCasesByPublishDate if d TotalCases NaN totalcases 100 const date d Date new Date d Date getTime if areacode in datain datain areacode totalcases totalcases else datain areacode totalcases totalcases let datamap Object values datain map function item return item totalcases let datarange d3 extent datamap console log datarange datarange Create a map of the UK use areacodes associate numbers values let mapurl https raw githubusercontent com martinjc UK GeoJSON master json administrative gb topo_lad json let data await fetch mapurl let uk await data json topojson feature county county objects counties features let mapFeatures for let key in uk objects mapFeatures topojson feature uk uk objects key features break var width 600 height 800 var projection d3 geoAlbers center 0 55 4 rotate 4 4 0 parallels 50 60 scale 800 5 translate width 2 height 2 var path d3 geoPath projection projection var svg d3 select body append svg attr width width attr height height var myColors d3 scaleLinear range yellow blue unknown ccc console log myColors 10 1 svg selectAll subunit data mapFeatures enter append path attr class feature attr d path style fill function d i k console log d properties LAD13NM get areacode or areaname if d id S12000036 return red const areacode d id if areacode in datain return myColors datain areacode totalcases datarange 1 return white return blue append svg title attr transform function d return translate path centroid d attr dy 35em text function d var name d properties LAD13NM var areacode d id if areacode in datain name datain areacode totalcases return name document body style height 800px script