Skip to content

Instantly share code, notes, and snippets.

@kjgarza
Forked from tlfrd/.block
Last active January 1, 2020 08:26
Show Gist options
  • Save kjgarza/cb5777ac9a15a9e4eb4024b300abeaee to your computer and use it in GitHub Desktop.
Save kjgarza/cb5777ac9a15a9e4eb4024b300abeaee to your computer and use it in GitHub Desktop.
Gridplot
license: mit
height: 650

An example of a Gridplot. Visualising what proportion of those who earn over 140k at London universities are women.

This is part of a series of visualisations called My Visual Vocabulary which aims to recreate every visualisation in the FT's Visual Vocabulary from scratch using D3.

Future ideas:

  • Transition to force layout
  • Transition from force layout to pie chart
[{"id":"bl.jisc","title":"Jisc","count":383910,"temporal":{"this_month":[{"id":"2019","title":"2019","count":219707}],"this_year":[{"id":"2019","title":"2019","count":383910}],"last_year":[{"id":"2018","title":"2018","count":0}]},"states":[{"id":"draft","title":"Draft","count":383910}]},{"id":"bl.imperial","title":"Imperial College London","count":202925,"temporal":{"this_month":[{"id":"2019","title":"2019","count":191}],"this_year":[{"id":"2019","title":"2019","count":595}],"last_year":[{"id":"2018","title":"2018","count":1468}]},"states":[{"id":"findable","title":"Findable","count":197552},{"id":"registered","title":"Registered","count":5310},{"id":"draft","title":"Draft","count":63}]},{"id":"bl.ads","title":"Archaeology Data Service","count":52097,"temporal":{"this_month":[{"id":"2019","title":"2019","count":580}],"this_year":[{"id":"2019","title":"2019","count":2092}],"last_year":[{"id":"2018","title":"2018","count":3835}]},"states":[{"id":"findable","title":"Findable","count":52083},{"id":"registered","title":"Registered","count":8},{"id":"draft","title":"Draft","count":6}]},{"id":"bl.cam","title":"University of Cambridge","count":37088,"temporal":{"this_month":[{"id":"2019","title":"2019","count":993}],"this_year":[{"id":"2019","title":"2019","count":4417}],"last_year":[{"id":"2018","title":"2018","count":17599}]},"states":[{"id":"findable","title":"Findable","count":36314},{"id":"draft","title":"Draft","count":657},{"id":"registered","title":"Registered","count":117}]},{"id":"bl.mendeley","title":"Mendeley","count":32156,"temporal":{"this_month":[{"id":"2019","title":"2019","count":1740}],"this_year":[{"id":"2019","title":"2019","count":7932}],"last_year":[{"id":"2018","title":"2018","count":12636}]},"states":[{"id":"findable","title":"Findable","count":24352},{"id":"registered","title":"Registered","count":7702},{"id":"draft","title":"Draft","count":102}]},{"id":"bl.dri","title":"Digital Repository of Ireland","count":28477,"temporal":{"this_month":[{"id":"2019","title":"2019","count":70}],"this_year":[{"id":"2019","title":"2019","count":260}],"last_year":[{"id":"2018","title":"2018","count":1653}]},"states":[{"id":"findable","title":"Findable","count":28468},{"id":"draft","title":"Draft","count":8},{"id":"registered","title":"Registered","count":1}]},{"id":"bl.f1000r","title":"Faculty of 1000 Research Ltd","count":17653,"temporal":{"this_month":[{"id":"2019","title":"2019","count":682}],"this_year":[{"id":"2019","title":"2019","count":2539}],"last_year":[{"id":"2018","title":"2018","count":3674}]},"states":[{"id":"findable","title":"Findable","count":17650},{"id":"draft","title":"Draft","count":3}]},{"id":"bl.oxdb","title":"Oxford University Library Service Databank","count":16200,"temporal":{"this_month":[{"id":"2019","title":"2019","count":10}],"this_year":[{"id":"2019","title":"2019","count":82}],"last_year":[{"id":"2018","title":"2018","count":2447}]},"states":[{"id":"findable","title":"Findable","count":16194},{"id":"draft","title":"Draft","count":4},{"id":"registered","title":"Registered","count":2}]},{"id":"bl.stfc","title":"Science and Technology Facilities Council","count":14323,"temporal":{"this_month":[{"id":"2019","title":"2019","count":4112}],"this_year":[{"id":"2019","title":"2019","count":4400}],"last_year":[{"id":"2018","title":"2018","count":1401}]},"states":[{"id":"findable","title":"Findable","count":14319},{"id":"registered","title":"Registered","count":4}]},{"id":"bl.ukda","title":"UK Data Archive","count":10785,"temporal":{"this_month":[{"id":"2019","title":"2019","count":30}],"this_year":[{"id":"2019","title":"2019","count":202}],"last_year":[{"id":"2018","title":"2018","count":1111}]},"states":[{"id":"findable","title":"Findable","count":10741},{"id":"draft","title":"Draft","count":39},{"id":"registered","title":"Registered","count":5}]},{"id":"bl.york","title":"University of York","count":10293,"temporal":{"this_month":[{"id":"2019","title":"2019","count":7}],"this_year":[{"id":"2019","title":"2019","count":16}],"last_year":[{"id":"2018","title":"2018","count":82}]},"states":[{"id":"findable","title":"Findable","count":10286},{"id":"draft","title":"Draft","count":6},{"id":"registered","title":"Registered","count":1}]},{"id":"bl.ccdc","title":"The Cambridge Crystallographic Data Centre","count":3588,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":0}],"last_year":[{"id":"2018","title":"2018","count":3431}]},"states":[{"id":"findable","title":"Findable","count":3429},{"id":"registered","title":"Registered","count":159}]},{"id":"bl.lboro","title":"Loughborough University","count":3560,"temporal":{"this_month":[{"id":"2019","title":"2019","count":17}],"this_year":[{"id":"2019","title":"2019","count":1714}],"last_year":[{"id":"2018","title":"2018","count":1394}]},"states":[{"id":"findable","title":"Findable","count":3433},{"id":"registered","title":"Registered","count":104},{"id":"draft","title":"Draft","count":23}]},{"id":"bl.soton","title":"University of Southampton","count":2769,"temporal":{"this_month":[{"id":"2019","title":"2019","count":74}],"this_year":[{"id":"2019","title":"2019","count":146}],"last_year":[{"id":"2018","title":"2018","count":450}]},"states":[{"id":"findable","title":"Findable","count":2746},{"id":"registered","title":"Registered","count":23}]},{"id":"bl.ed","title":"University of Edinburgh","count":2504,"temporal":{"this_month":[{"id":"2019","title":"2019","count":13}],"this_year":[{"id":"2019","title":"2019","count":58}],"last_year":[{"id":"2018","title":"2018","count":226}]},"states":[{"id":"findable","title":"Findable","count":2498},{"id":"draft","title":"Draft","count":3},{"id":"registered","title":"Registered","count":3}]},{"id":"bl.nerc","title":"Natural Environment Research Council","count":1650,"temporal":{"this_month":[{"id":"2019","title":"2019","count":53}],"this_year":[{"id":"2019","title":"2019","count":144}],"last_year":[{"id":"2018","title":"2018","count":445}]},"states":[{"id":"findable","title":"Findable","count":1639},{"id":"draft","title":"Draft","count":9},{"id":"registered","title":"Registered","count":2}]},{"id":"bl.lshtm","title":"London School of Hygiene and Tropical Medicine","count":1527,"temporal":{"this_month":[{"id":"2019","title":"2019","count":13}],"this_year":[{"id":"2019","title":"2019","count":125}],"last_year":[{"id":"2018","title":"2018","count":319}]},"states":[{"id":"findable","title":"Findable","count":1523},{"id":"draft","title":"Draft","count":2},{"id":"registered","title":"Registered","count":2}]},{"id":"bl.mba","title":"Marine Biological Association","count":1361,"temporal":{"this_month":[{"id":"2019","title":"2019","count":5}],"this_year":[{"id":"2019","title":"2019","count":1346}],"last_year":[{"id":"2018","title":"2018","count":8}]},"states":[{"id":"findable","title":"Findable","count":1345},{"id":"draft","title":"Draft","count":13},{"id":"registered","title":"Registered","count":3}]},{"id":"bl.shef","title":"University of Sheffield","count":1208,"temporal":{"this_month":[{"id":"2019","title":"2019","count":16}],"this_year":[{"id":"2019","title":"2019","count":69}],"last_year":[{"id":"2018","title":"2018","count":232}]},"states":[{"id":"findable","title":"Findable","count":1023},{"id":"registered","title":"Registered","count":139},{"id":"draft","title":"Draft","count":46}]},{"id":"bl.ecmwf","title":"European Centre for Medium-Range Weather Forecasts","count":1138,"temporal":{"this_month":[{"id":"2019","title":"2019","count":6}],"this_year":[{"id":"2019","title":"2019","count":36}],"last_year":[{"id":"2018","title":"2018","count":918}]},"states":[{"id":"findable","title":"Findable","count":1123},{"id":"draft","title":"Draft","count":13},{"id":"registered","title":"Registered","count":2}]},{"id":"bl.ljmu","title":"Liverpool John Moores University","count":1050,"temporal":{"this_month":[{"id":"2019","title":"2019","count":11}],"this_year":[{"id":"2019","title":"2019","count":40}],"last_year":[{"id":"2018","title":"2018","count":1008}]},"states":[{"id":"findable","title":"Findable","count":1050}]},{"id":"bl.cran","title":"Cranfield University","count":958,"temporal":{"this_month":[{"id":"2019","title":"2019","count":15}],"this_year":[{"id":"2019","title":"2019","count":63}],"last_year":[{"id":"2018","title":"2018","count":421}]},"states":[{"id":"findable","title":"Findable","count":789},{"id":"registered","title":"Registered","count":142},{"id":"draft","title":"Draft","count":27}]},{"id":"bl.lancs","title":"University of Lancaster","count":850,"temporal":{"this_month":[{"id":"2019","title":"2019","count":22}],"this_year":[{"id":"2019","title":"2019","count":125}],"last_year":[{"id":"2018","title":"2018","count":345}]},"states":[{"id":"findable","title":"Findable","count":849},{"id":"registered","title":"Registered","count":1}]},{"id":"bl.salford","title":"University of Salford","count":780,"temporal":{"this_month":[{"id":"2019","title":"2019","count":243}],"this_year":[{"id":"2019","title":"2019","count":340}],"last_year":[{"id":"2018","title":"2018","count":299}]},"states":[{"id":"findable","title":"Findable","count":686},{"id":"registered","title":"Registered","count":67},{"id":"draft","title":"Draft","count":27}]},{"id":"bl.gold","title":"Goldsmiths' College","count":777,"temporal":{"this_month":[{"id":"2019","title":"2019","count":19}],"this_year":[{"id":"2019","title":"2019","count":323}],"last_year":[{"id":"2018","title":"2018","count":454}]},"states":[{"id":"findable","title":"Findable","count":776},{"id":"draft","title":"Draft","count":1}]},{"id":"bl.brookes","title":"Oxford Brookes University","count":754,"temporal":{"this_month":[{"id":"2019","title":"2019","count":59}],"this_year":[{"id":"2019","title":"2019","count":70}],"last_year":[{"id":"2018","title":"2018","count":223}]},"states":[{"id":"findable","title":"Findable","count":753},{"id":"registered","title":"Registered","count":1}]},{"id":"bl.strath","title":"University of Strathclyde","count":712,"temporal":{"this_month":[{"id":"2019","title":"2019","count":15}],"this_year":[{"id":"2019","title":"2019","count":72}],"last_year":[{"id":"2018","title":"2018","count":201}]},"states":[{"id":"findable","title":"Findable","count":700},{"id":"registered","title":"Registered","count":8},{"id":"draft","title":"Draft","count":4}]},{"id":"bl.uel","title":"University of East London","count":701,"temporal":{"this_month":[{"id":"2019","title":"2019","count":2}],"this_year":[{"id":"2019","title":"2019","count":20}],"last_year":[{"id":"2018","title":"2018","count":590}]},"states":[{"id":"findable","title":"Findable","count":698},{"id":"draft","title":"Draft","count":2},{"id":"registered","title":"Registered","count":1}]},{"id":"bl.sahfos","title":"Sir Alister Hardy Foundation for Ocean Science","count":677,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":6}],"last_year":[{"id":"2018","title":"2018","count":65}]},"states":[{"id":"findable","title":"Findable","count":674},{"id":"draft","title":"Draft","count":3}]},{"id":"bl.rhul","title":"Royal Holloway, University of London","count":664,"temporal":{"this_month":[{"id":"2019","title":"2019","count":2}],"this_year":[{"id":"2019","title":"2019","count":14}],"last_year":[{"id":"2018","title":"2018","count":612}]},"states":[{"id":"findable","title":"Findable","count":642},{"id":"registered","title":"Registered","count":21},{"id":"draft","title":"Draft","count":1}]},{"id":"bl.esds-i","title":"ESDS International Mimas, The University of Manchester","count":587,"temporal":{"this_month":[{"id":"2019","title":"2019","count":2}],"this_year":[{"id":"2019","title":"2019","count":68}],"last_year":[{"id":"2018","title":"2018","count":8}]},"states":[{"id":"findable","title":"Findable","count":581},{"id":"registered","title":"Registered","count":5},{"id":"draft","title":"Draft","count":1}]},{"id":"bl.leeds","title":"University of Leeds","count":533,"temporal":{"this_month":[{"id":"2019","title":"2019","count":6}],"this_year":[{"id":"2019","title":"2019","count":41}],"last_year":[{"id":"2018","title":"2018","count":176}]},"states":[{"id":"findable","title":"Findable","count":513},{"id":"registered","title":"Registered","count":17},{"id":"draft","title":"Draft","count":3}]},{"id":"bl.bristol","title":"University of Bristol","count":517,"temporal":{"this_month":[{"id":"2019","title":"2019","count":20}],"this_year":[{"id":"2019","title":"2019","count":63}],"last_year":[{"id":"2018","title":"2018","count":141}]},"states":[{"id":"findable","title":"Findable","count":511},{"id":"registered","title":"Registered","count":5},{"id":"draft","title":"Draft","count":1}]},{"id":"bl.standrew","title":"University of St Andrews","count":512,"temporal":{"this_month":[{"id":"2019","title":"2019","count":29}],"this_year":[{"id":"2019","title":"2019","count":77}],"last_year":[{"id":"2018","title":"2018","count":134}]},"states":[{"id":"findable","title":"Findable","count":495},{"id":"registered","title":"Registered","count":10},{"id":"draft","title":"Draft","count":7}]},{"id":"bl.surrey","title":"University of Surrey","count":465,"temporal":{"this_month":[{"id":"2019","title":"2019","count":16}],"this_year":[{"id":"2019","title":"2019","count":95}],"last_year":[{"id":"2018","title":"2018","count":143}]},"states":[{"id":"findable","title":"Findable","count":450},{"id":"registered","title":"Registered","count":15}]},{"id":"bl.lse","title":"London School of Economics","count":437,"temporal":{"this_month":[{"id":"2019","title":"2019","count":5}],"this_year":[{"id":"2019","title":"2019","count":44}],"last_year":[{"id":"2018","title":"2018","count":233}]},"states":[{"id":"findable","title":"Findable","count":434},{"id":"draft","title":"Draft","count":2},{"id":"registered","title":"Registered","count":1}]},{"id":"bl.glasgow","title":"University of Glasgow","count":403,"temporal":{"this_month":[{"id":"2019","title":"2019","count":4}],"this_year":[{"id":"2019","title":"2019","count":32}],"last_year":[{"id":"2018","title":"2018","count":92}]},"states":[{"id":"findable","title":"Findable","count":323},{"id":"registered","title":"Registered","count":80}]},{"id":"bl.rothres","title":"Rothamsted Research","count":366,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":3}],"last_year":[{"id":"2018","title":"2018","count":111}]},"states":[{"id":"findable","title":"Findable","count":366}]},{"id":"bl.ncl","title":"Newcastle University","count":342,"temporal":{"this_month":[{"id":"2019","title":"2019","count":4}],"this_year":[{"id":"2019","title":"2019","count":30}],"last_year":[{"id":"2018","title":"2018","count":86}]},"states":[{"id":"findable","title":"Findable","count":342}]},{"id":"bl.nhm","title":"Natural History Museum, London","count":337,"temporal":{"this_month":[{"id":"2019","title":"2019","count":184}],"this_year":[{"id":"2019","title":"2019","count":192}],"last_year":[{"id":"2018","title":"2018","count":24}]},"states":[{"id":"findable","title":"Findable","count":334},{"id":"draft","title":"Draft","count":3}]},{"id":"bl.eap","title":"Endangered Archives Project","count":332,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":11}],"last_year":[{"id":"2018","title":"2018","count":9}]},"states":[{"id":"findable","title":"Findable","count":332}]},{"id":"bl.bath","title":"University of Bath","count":299,"temporal":{"this_month":[{"id":"2019","title":"2019","count":6}],"this_year":[{"id":"2019","title":"2019","count":31}],"last_year":[{"id":"2018","title":"2018","count":85}]},"states":[{"id":"findable","title":"Findable","count":292},{"id":"registered","title":"Registered","count":7}]},{"id":"bl.aston","title":"Aston University","count":248,"temporal":{"this_month":[{"id":"2019","title":"2019","count":7}],"this_year":[{"id":"2019","title":"2019","count":18}],"last_year":[{"id":"2018","title":"2018","count":60}]},"states":[{"id":"findable","title":"Findable","count":248}]},{"id":"bl.cardiff","title":"Cardiff University","count":239,"temporal":{"this_month":[{"id":"2019","title":"2019","count":7}],"this_year":[{"id":"2019","title":"2019","count":24}],"last_year":[{"id":"2018","title":"2018","count":62}]},"states":[{"id":"findable","title":"Findable","count":237},{"id":"registered","title":"Registered","count":2}]},{"id":"bl.mchester","title":"University of Manchester","count":221,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":0}],"last_year":[{"id":"2018","title":"2018","count":0}]},"states":[{"id":"findable","title":"Findable","count":220},{"id":"draft","title":"Draft","count":1}]},{"id":"bl.marinesc","title":"Marine Scotland","count":219,"temporal":{"this_month":[{"id":"2019","title":"2019","count":7}],"this_year":[{"id":"2019","title":"2019","count":8}],"last_year":[{"id":"2018","title":"2018","count":36}]},"states":[{"id":"findable","title":"Findable","count":216},{"id":"draft","title":"Draft","count":2},{"id":"registered","title":"Registered","count":1}]},{"id":"bl.durham","title":"Durham University","count":198,"temporal":{"this_month":[{"id":"2019","title":"2019","count":5}],"this_year":[{"id":"2019","title":"2019","count":25}],"last_year":[{"id":"2018","title":"2018","count":42}]},"states":[{"id":"findable","title":"Findable","count":198}]},{"id":"bl.iita","title":"International Institute of Tropical Agriculture datasets","count":182,"temporal":{"this_month":[{"id":"2019","title":"2019","count":3}],"this_year":[{"id":"2019","title":"2019","count":27}],"last_year":[{"id":"2018","title":"2018","count":155}]},"states":[{"id":"findable","title":"Findable","count":182}]},{"id":"bl.metadata","title":"British Library Metadata Standards","count":169,"temporal":{"this_month":[{"id":"2019","title":"2019","count":6}],"this_year":[{"id":"2019","title":"2019","count":18}],"last_year":[{"id":"2018","title":"2018","count":68}]},"states":[{"id":"findable","title":"Findable","count":169}]},{"id":"bl.lpool","title":"University of Liverpool","count":165,"temporal":{"this_month":[{"id":"2019","title":"2019","count":5}],"this_year":[{"id":"2019","title":"2019","count":14}],"last_year":[{"id":"2018","title":"2018","count":45}]},"states":[{"id":"findable","title":"Findable","count":164},{"id":"registered","title":"Registered","count":1}]},{"id":"bl.open","title":"The Open University","count":164,"temporal":{"this_month":[{"id":"2019","title":"2019","count":11}],"this_year":[{"id":"2019","title":"2019","count":31}],"last_year":[{"id":"2018","title":"2018","count":39}]},"states":[{"id":"findable","title":"Findable","count":132},{"id":"registered","title":"Registered","count":31},{"id":"draft","title":"Draft","count":1}]},{"id":"bl.brunel","title":"Brunel University London","count":162,"temporal":{"this_month":[{"id":"2019","title":"2019","count":6}],"this_year":[{"id":"2019","title":"2019","count":19}],"last_year":[{"id":"2018","title":"2018","count":53}]},"states":[{"id":"findable","title":"Findable","count":128},{"id":"registered","title":"Registered","count":22},{"id":"draft","title":"Draft","count":12}]},{"id":"bl.bham","title":"University of Birmingham","count":151,"temporal":{"this_month":[{"id":"2019","title":"2019","count":6}],"this_year":[{"id":"2019","title":"2019","count":24}],"last_year":[{"id":"2018","title":"2018","count":127}]},"states":[{"id":"findable","title":"Findable","count":149},{"id":"draft","title":"Draft","count":1},{"id":"registered","title":"Registered","count":1}]},{"id":"bl.qub","title":"Queen's University Belfast","count":139,"temporal":{"this_month":[{"id":"2019","title":"2019","count":1}],"this_year":[{"id":"2019","title":"2019","count":23}],"last_year":[{"id":"2018","title":"2018","count":35}]},"states":[{"id":"findable","title":"Findable","count":138},{"id":"registered","title":"Registered","count":1}]},{"id":"bl.fba","title":"Freshwater Biological Association","count":127,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":0}],"last_year":[{"id":"2018","title":"2018","count":0}]},"states":[{"id":"findable","title":"Findable","count":127}]},{"id":"bl.mdx","title":"Middlesex University","count":125,"temporal":{"this_month":[{"id":"2019","title":"2019","count":5}],"this_year":[{"id":"2019","title":"2019","count":13}],"last_year":[{"id":"2018","title":"2018","count":85}]},"states":[{"id":"findable","title":"Findable","count":110},{"id":"registered","title":"Registered","count":11},{"id":"draft","title":"Draft","count":4}]},{"id":"bl.notts","title":"University of Nottingham","count":120,"temporal":{"this_month":[{"id":"2019","title":"2019","count":3}],"this_year":[{"id":"2019","title":"2019","count":11}],"last_year":[{"id":"2018","title":"2018","count":35}]},"states":[{"id":"findable","title":"Findable","count":108},{"id":"registered","title":"Registered","count":9},{"id":"draft","title":"Draft","count":3}]},{"id":"bl.cefas","title":"Cefas","count":118,"temporal":{"this_month":[{"id":"2019","title":"2019","count":6}],"this_year":[{"id":"2019","title":"2019","count":11}],"last_year":[{"id":"2018","title":"2018","count":16}]},"states":[{"id":"findable","title":"Findable","count":118}]},{"id":"bl.lsbu","title":"London Southbank University","count":117,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":4}],"last_year":[{"id":"2018","title":"2018","count":93}]},"states":[{"id":"findable","title":"Findable","count":117}]},{"id":"bl.hwu","title":"Heriot-Watt University","count":104,"temporal":{"this_month":[{"id":"2019","title":"2019","count":3}],"this_year":[{"id":"2019","title":"2019","count":8}],"last_year":[{"id":"2018","title":"2018","count":19}]},"states":[{"id":"findable","title":"Findable","count":104}]},{"id":"bl.labs","title":"British Library Labs","count":104,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":0}],"last_year":[{"id":"2018","title":"2018","count":17}]},"states":[{"id":"findable","title":"Findable","count":104}]},{"id":"bl.exeter","title":"University of Exeter","count":102,"temporal":{"this_month":[{"id":"2019","title":"2019","count":3}],"this_year":[{"id":"2019","title":"2019","count":16}],"last_year":[{"id":"2018","title":"2018","count":82}]},"states":[{"id":"findable","title":"Findable","count":83},{"id":"draft","title":"Draft","count":18},{"id":"registered","title":"Registered","count":1}]},{"id":"bl.qmul","title":"Queen Mary University of London","count":94,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":0}],"last_year":[{"id":"2018","title":"2018","count":3}]},"states":[{"id":"findable","title":"Findable","count":94}]},{"id":"bl.reading","title":"University of Reading","count":93,"temporal":{"this_month":[{"id":"2019","title":"2019","count":3}],"this_year":[{"id":"2019","title":"2019","count":11}],"last_year":[{"id":"2018","title":"2018","count":34}]},"states":[{"id":"findable","title":"Findable","count":93}]},{"id":"bl.old-api","title":"BL's DOI service prototype","count":92,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":0}],"last_year":[{"id":"2018","title":"2018","count":0}]},"states":[{"id":"registered","title":"Registered","count":92}]},{"id":"bl.sgul","title":"St. George's University of London","count":92,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":24}],"last_year":[{"id":"2018","title":"2018","count":54}]},"states":[{"id":"findable","title":"Findable","count":69},{"id":"registered","title":"Registered","count":21},{"id":"draft","title":"Draft","count":2}]},{"id":"bl.dundee","title":"University of Dundee","count":66,"temporal":{"this_month":[{"id":"2019","title":"2019","count":4}],"this_year":[{"id":"2019","title":"2019","count":16}],"last_year":[{"id":"2018","title":"2018","count":12}]},"states":[{"id":"findable","title":"Findable","count":65},{"id":"draft","title":"Draft","count":1}]},{"id":"bl.bathspa","title":"Bath Spa University","count":62,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":6}],"last_year":[{"id":"2018","title":"2018","count":32}]},"states":[{"id":"findable","title":"Findable","count":60},{"id":"registered","title":"Registered","count":2}]},{"id":"bl.ucld","title":"University College London","count":52,"temporal":{"this_month":[{"id":"2019","title":"2019","count":12}],"this_year":[{"id":"2019","title":"2019","count":16}],"last_year":[{"id":"2018","title":"2018","count":5}]},"states":[{"id":"findable","title":"Findable","count":41},{"id":"registered","title":"Registered","count":11}]},{"id":"bl.uclan","title":"University of Central Lancashire","count":51,"temporal":{"this_month":[{"id":"2019","title":"2019","count":2}],"this_year":[{"id":"2019","title":"2019","count":3}],"last_year":[{"id":"2018","title":"2018","count":6}]},"states":[{"id":"findable","title":"Findable","count":51}]},{"id":"bl.dmu","title":"De Montfort University","count":45,"temporal":{"this_month":[{"id":"2019","title":"2019","count":20}],"this_year":[{"id":"2019","title":"2019","count":42}],"last_year":[{"id":"2018","title":"2018","count":3}]},"states":[{"id":"findable","title":"Findable","count":28},{"id":"registered","title":"Registered","count":17}]},{"id":"bl.kcl","title":"King's College London","count":44,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":6}],"last_year":[{"id":"2018","title":"2018","count":13}]},"states":[{"id":"findable","title":"Findable","count":44}]},{"id":"bl.portsmth","title":"University of Portsmouth","count":41,"temporal":{"this_month":[{"id":"2019","title":"2019","count":6}],"this_year":[{"id":"2019","title":"2019","count":11}],"last_year":[{"id":"2018","title":"2018","count":15}]},"states":[{"id":"findable","title":"Findable","count":37},{"id":"registered","title":"Registered","count":4}]},{"id":"bl.rsc","title":"Royal Society of Chemistry","count":39,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":0}],"last_year":[{"id":"2018","title":"2018","count":24}]},"states":[{"id":"findable","title":"Findable","count":39}]},{"id":"bl.herts","title":"University of Hertfordshire","count":37,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":1}],"last_year":[{"id":"2018","title":"2018","count":30}]},"states":[{"id":"findable","title":"Findable","count":28},{"id":"registered","title":"Registered","count":8},{"id":"draft","title":"Draft","count":1}]},{"id":"bl.keele","title":"Keele University","count":37,"temporal":{"this_month":[{"id":"2019","title":"2019","count":1}],"this_year":[{"id":"2019","title":"2019","count":1}],"last_year":[{"id":"2018","title":"2018","count":16}]},"states":[{"id":"findable","title":"Findable","count":37}]},{"id":"bl.abdn","title":"University of Aberdeen","count":33,"temporal":{"this_month":[{"id":"2019","title":"2019","count":4}],"this_year":[{"id":"2019","title":"2019","count":7}],"last_year":[{"id":"2018","title":"2018","count":13}]},"states":[{"id":"findable","title":"Findable","count":33}]},{"id":"bl.hallam","title":"Sheffield Hallam University","count":30,"temporal":{"this_month":[{"id":"2019","title":"2019","count":1}],"this_year":[{"id":"2019","title":"2019","count":4}],"last_year":[{"id":"2018","title":"2018","count":8}]},"states":[{"id":"findable","title":"Findable","count":28},{"id":"draft","title":"Draft","count":1},{"id":"registered","title":"Registered","count":1}]},{"id":"bl.aber","title":"University of Aberystwyth","count":25,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":4}],"last_year":[{"id":"2018","title":"2018","count":5}]},"states":[{"id":"findable","title":"Findable","count":20},{"id":"registered","title":"Registered","count":5}]},{"id":"bl.wap","title":"Web Archive Programme at BL","count":24,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":0}],"last_year":[{"id":"2018","title":"2018","count":0}]},"states":[{"id":"findable","title":"Findable","count":19},{"id":"registered","title":"Registered","count":5}]},{"id":"bl.kent","title":"University of Kent","count":21,"temporal":{"this_month":[{"id":"2019","title":"2019","count":2}],"this_year":[{"id":"2019","title":"2019","count":9}],"last_year":[{"id":"2018","title":"2018","count":11}]},"states":[{"id":"findable","title":"Findable","count":21}]},{"id":"bl.rcm","title":"Royal College of Music","count":20,"temporal":{"this_month":[{"id":"2019","title":"2019","count":2}],"this_year":[{"id":"2019","title":"2019","count":20}],"last_year":[{"id":"2018","title":"2018","count":0}]},"states":[{"id":"findable","title":"Findable","count":20}]},{"id":"bl.mmu","title":"Manchester Metropolitan University","count":17,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":0}],"last_year":[{"id":"2018","title":"2018","count":11}]},"states":[{"id":"findable","title":"Findable","count":15},{"id":"registered","title":"Registered","count":2}]},{"id":"bl.essex","title":"University of Essex","count":15,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":0}],"last_year":[{"id":"2018","title":"2018","count":4}]},"states":[{"id":"findable","title":"Findable","count":15}]},{"id":"bl.marineie","title":"Marine Institute","count":13,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":2}],"last_year":[{"id":"2018","title":"2018","count":9}]},"states":[{"id":"findable","title":"Findable","count":13}]},{"id":"bl.bmouth","title":"Bournemouth University","count":12,"temporal":{"this_month":[{"id":"2019","title":"2019","count":1}],"this_year":[{"id":"2019","title":"2019","count":12}],"last_year":[{"id":"2018","title":"2018","count":0}]},"states":[{"id":"findable","title":"Findable","count":11},{"id":"draft","title":"Draft","count":1}]},{"id":"bl.birkbeck","title":"Birkbeck, University of London","count":11,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":2}],"last_year":[{"id":"2018","title":"2018","count":5}]},"states":[{"id":"findable","title":"Findable","count":11}]},{"id":"bl.napier","title":"Edinburgh Napier University","count":10,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":1}],"last_year":[{"id":"2018","title":"2018","count":2}]},"states":[{"id":"findable","title":"Findable","count":8},{"id":"registered","title":"Registered","count":2}]},{"id":"bl.ulster","title":"Ulster University","count":10,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":2}],"last_year":[{"id":"2018","title":"2018","count":8}]},"states":[{"id":"findable","title":"Findable","count":9},{"id":"draft","title":"Draft","count":1}]},{"id":"bl.phe","title":"Public Health England","count":9,"temporal":{"this_month":[{"id":"2019","title":"2019","count":1}],"this_year":[{"id":"2019","title":"2019","count":7}],"last_year":[{"id":"2018","title":"2018","count":2}]},"states":[{"id":"findable","title":"Findable","count":7},{"id":"draft","title":"Draft","count":2}]},{"id":"bl.brighton","title":"University of Brighton","count":8,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":1}],"last_year":[{"id":"2018","title":"2018","count":0}]},"states":[{"id":"findable","title":"Findable","count":8}]},{"id":"bl.ntu","title":"Nottingham Trent University","count":4,"temporal":{"this_month":[{"id":"2019","title":"2019","count":4}],"this_year":[{"id":"2019","title":"2019","count":4}],"last_year":[{"id":"2018","title":"2018","count":0}]},"states":[{"id":"findable","title":"Findable","count":4}]},{"id":"bl.plymouth","title":"Plymouth University","count":3,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":1}],"last_year":[{"id":"2018","title":"2018","count":2}]},"states":[{"id":"findable","title":"Findable","count":3}]},{"id":"bl.repo","title":"British Library Access Repository","count":2,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":0}],"last_year":[{"id":"2018","title":"2018","count":2}]},"states":[{"id":"findable","title":"Findable","count":2}]},{"id":"bl.jncc","title":"Joint Nature Conservation Committee","count":1,"temporal":{"this_month":[{"id":"2019","title":"2019","count":0}],"this_year":[{"id":"2019","title":"2019","count":0}],"last_year":[{"id":"2018","title":"2018","count":1}]},"states":[{"id":"findable","title":"Findable","count":1}]}]
var margin = {top: 100, right: 0, bottom: 50, left: 50};
var width = 960 - margin.left - margin.right,
height = 650 - margin.top - margin.bottom;
var svg = d3.select("body").append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)
.append("g")
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
var dataURL = "cul.json";
var config = {
radius: 4,
padding: 5,
top: 25,
left: 0,
iconWidth: 8,
largeIconWidth: 64,
legendOffset: 100,
gridWidth: 7
};
var dataArray;
d3.json(dataURL, function(error, payData) {
if (error) throw error;
// payData = payData.number_over_140k.filter(d => d.women != "-")
dataArray = [];
payData.forEach(d => {
draft = d.states[0] ? Math.ceil(d.states[0].count/1000) : 0
findable = d.states[1] ? Math.ceil(d.states[1].count/1000): 0
registered = d.states[2] ? Math.ceil(d.states[2].count/1000): 0
dataArray.push({
name: d.title.substring(0, 10),
pay: [{type: "draft", value: draft}, {type: "findable", value: findable}]
})
});
dataArray.sort((a, b) => a.pay[1].value > b.pay[1].value ? 1 : -1)
console.log(dataArray)
var gridGroups = svg.append("g")
.attr("class", "grids");
var payGrids = gridGroups.selectAll("g")
.data(dataArray)
.enter().append("g")
.attr("class", "pay-grid")
.attr("transform", (d, i) =>
"translate(" +
[config.left + ((config.iconWidth * config.radius * 4) * (i % config.gridWidth)),
config.top + findMaxHeightOfPreviousRow(dataArray, i, config.iconWidth) * (config.radius * 20)] + ")")
payGrids.each(function(d) {
var selection = d3.select(this);
drawGridplot(selection, config, d.pay, config.iconWidth);
});
payGrids.append("text")
.attr("class", "label")
.attr("x", -config.radius)
.attr("y", -config.radius * 4)
.text(d => d.name);
var legend = svg.append("g")
.attr("class", "legend")
.attr("transform", "translate(" + [0, height - margin.bottom / 2] + ")");
var title = svg.append("text")
.attr("class", "title")
.attr("text-anchor", "start")
.attr("y", -margin.top / 2)
.attr("x", -config.radius)
.text("The Number of DOIS from Columbia University Libraries");
var legendIcons = legend.selectAll("g")
.data(dataArray[0].pay)
.enter().append("g")
.attr("class", d => d.type)
.attr("transform", (d, i) => "translate(" + [(i) * config.legendOffset, 0] + ")");
legendIcons.append("circle")
.attr("r", config.radius);
legendIcons.append("text")
.attr("x", config.radius * 3)
.attr("y", config.radius)
.text(d => d.type)
legend.append("circle")
.attr("class", "women-uncertain-legend")
.attr("cy", 30)
.attr("r", config.radius)
legend.append("text")
.attr("class", "women-uncertain-text")
.attr("x", config.radius * 3)
.attr("y", 30 + config.radius)
.text("Range Provided Only");
var allLabel = svg.append("g")
.attr("class", "all-label")
.append("text")
.attr("transform", "translate(" + [-config.radius, config.radius * 2] + ")")
.text("All")
.style("opacity", 0);
});
d3.select("svg").on("click", animate);
var separate = true;
function animate() {
var labels = svg.selectAll(".label");
var men = svg.selectAll(".men");
var women = svg.selectAll(".women");
var womenUn = svg.selectAll(".women-uncertain");
var payGrids = svg.selectAll(".pay-grid");
var womenUnOffset = women.size() - 1,
menOffset = womenUnOffset + womenUn.size() - 1;
if (separate) {
labels.transition()
.style("opacity", 0);
payGrids.transition().duration(1000).attr("transform", "translate(" + [0, config.top] + ")");
women.transition()
.duration(1000)
.attr("cx", (d, i) => (i % config.largeIconWidth) * (config.radius * 2 + config.padding))
.attr("cy", (d, i) => Math.floor(i / config.largeIconWidth) * (config.radius * 2 + config.padding));
womenUn.transition()
.duration(1000)
.attr("cx", (d, i) => ((womenUnOffset + i) % config.largeIconWidth) * (config.radius * 2 + config.padding))
.attr("cy", (d, i) => Math.floor((womenUnOffset + i) / config.largeIconWidth) * (config.radius * 2 + config.padding));
men.transition()
.duration(1000)
.attr("cx", (d, i) => ((menOffset + i) % config.largeIconWidth) * (config.radius * 2 + config.padding))
.attr("cy", (d, i) => Math.floor((menOffset + i) / config.largeIconWidth) * (config.radius * 2 + config.padding));
svg.transition()
.delay(500)
.duration(500)
.select(".all-label text")
.style("opacity", 1);
} else {
payGrids.transition()
.duration(1000)
.attr("transform", (d, i) =>
"translate(" +
[config.left + ((config.iconWidth * config.radius * 4) * (i % config.gridWidth)),
config.top + findMaxHeightOfPreviousRow(dataArray, i, config.iconWidth) * (config.radius * 20)] + ")");
women.transition()
.duration(1000)
.attr("cx", d => d.x * (config.radius * 2 + config.padding))
.attr("cy", d => d.y * (config.radius * 2 + config.padding));
womenUn.transition()
.duration(1000)
.attr("cx", d => d.x * (config.radius * 2 + config.padding))
.attr("cy", d => d.y * (config.radius * 2 + config.padding));
men.transition()
.duration(1000)
.attr("cx", d => d.x * (config.radius * 2 + config.padding))
.attr("cy", d => d.y * (config.radius * 2 + config.padding));
labels.transition()
.duration(1000)
.style("opacity", 1);
svg.transition()
.select(".all-label text")
.style("opacity", 0);
}
separate = !separate;
}
function findMaxHeightOfPreviousRow(array, currentIndex) {
var row = Math.floor(currentIndex / config.gridWidth) - 1;
var start = config.gridWidth * row,
end = config.gridWidth * (row + 1);
var highest = 0;
if (row >= 0) {
for (var i = start; i < end; i++) {
var total = array[i].pay[0].value + array[i].pay[1].value;
if (total > highest) {
highest = total;
}
}
}
var heightOfHeighest = Math.ceil(highest / config.iconWidth);
return heightOfHeighest;
}
function gridLayout(array, length) {
array.forEach(function(d, i) {
d.x = i % length;
d.y = Math.floor(i / length);
})
}
// Will draw a gridplot given an array of classes and values
function drawGridplot(elem, cfg, data, l) {
var total = d3.sum(data, d => d.value),
dataArray = new Array(total);
data.forEach(function(d, i) {
var previous = 0;
if (i > 0) previous = data[i - 1].value;
for (var w = previous; w < (d.value + previous); w++) {
dataArray[w] = {type: d.type};
};
});
gridLayout(dataArray, l);
var dotElems = elem.append("g")
.selectAll("circle")
.data(dataArray)
.enter().append("circle")
.attr("class", d => d.type)
.attr("cx", d => d.x * (config.radius * 2 + config.padding))
.attr("cy", d => d.y * (config.radius * 2 + config.padding))
.attr("r", cfg.radius);
}
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<script src="https://d3js.org/d3.v4.min.js"></script>
<link href="https://fonts.googleapis.com/css?family=Nunito:400,800" rel="stylesheet">
<style>
body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
text {
font-family: 'Nunito', sans-serif;
font-weight: 800;
font-size: 16px;
text-transform: capitalize;
}
.women {
fill: black;
}
.women-uncertain, .women-uncertain-legend {
fill: red;
}
.women-uncertain-text {
fill: grey;
}
.men {
fill: black;
opacity: 0.3;
}
.title {
font-size: 18px;
}
</style>
</head>
<body>
<script src="grid.js"></script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment