2a:null 2b:["$","title",null,{"children":"UK Parliament Party Totals | João Ricardo Mendes | Observable"}] 30:T18b7,// this is based on the code at https://github.com/Teester/parliament-diagram-generator/blob/master/script.js which was based on https://github.com/juliuste/parliament-svg { const svg = d3.create("svg"); const radius = 20; const totalSeats = data.length; if (data.length == 0) return "No data to display"; const numberOfRings = findN(totalSeats, radius); const a0 = findA(totalSeats, numberOfRings, radius); // calculate seat distance let points = []; // calculate ring radii var rings = [] for(var i = 1; i <= numberOfRings; i++){ rings[i] = radius - (i-1) * a0 } // calculate seats per ring rings = distribute(rings, totalSeats) var resultsList = []; var r, a, point // build seats // loop rings var ring for(var j = 1; j <= numberOfRings; j++){ ring = [] // calculate ring-specific radius r = radius - (j-1)*a0 // calculate ring-specific distance a = (Math.PI*r) / ((rings[j]-1) || 1) // loop points for(let k=0; k<=rings[j]-1; k++){ point = getCoordinates(r, k*a) point[2] = 0.4*a0 ring.push(point) } points.push(ring) } // fill seats var ringProgress = Array(points.length).fill(0) for(var party in partyTotals) { let key = partyTotals[party].key; for(var l=0; l d[6]) .attr("href", d => data[d[5]].mp.value) .attr("target", "_blank"); let count = 0; // svg.selectAll("circle") // .data(points) // .enter() // .append("circle") // .attr("cx", d => d[0]) // .attr("cy", d => d[1]) // .attr("r", d => d[2]) // .attr("fill", d => d[3]) // .append("title").text(d => d[4]) anchors.append("circle") .attr("cx", d => d[0]) .attr("cy", d => d[1]) .attr("r", d => d[2]) .attr("fill", d => d[3]) .style("opacity", function(d) { if (applyFilters(d)) { ++count; return 1; } return 0.1; }) // .append("title").text(d => `${d[5]} (${d[4]})`); // // add code to store the MPs' name and QID URL .append("title").text(d => `${data[d[5]].mpLabel.value} (${d[4]})`); // // add code to store the MPs' name and QID URL svg.append("text").text(count).style("font-size", "5px").style( "text-anchor", "middle"); return svg.node(); function filterByGender(d) { let dataItem = data[d[5]]; for (let i = 0; i < selectGender.length; i++) { // if (d[7] == selectGender[i]) return true; if (dataItem.genderLabel.value == selectGender[i]) return true; } return false; } function filterByParty(d) { for (let i = 0; i < selectParty.length; i++) { if (d[4] == selectParty[i]) return true; } return false; } function filterByAge(d) { let dataItem = data[d[5]]; if (dataItem.age.value >= selectAge[0] && dataItem.age.value <= selectAge[1]) return true; return false; } function applyFilters(d) { let filters = [ filterByGender, filterByParty, filterByAge] for (let f = 0; f < filters.length; f++) { if ( filters[f](d)) continue else return false; } return true } function findN(m, r) { var n = Math.floor(Math.log(m)/Math.log(2)) || 1; var distance = getScore(m, n, r); var direction = 0; if(getScore(m, n+1, r)1) direction = -1; while(getScore(m, n+direction, r)0){ distance = getScore(m, n+direction, r); n+=direction; } return n; } function findA(m, n, r) { var x = (Math.PI*n*r)/(m-n) var y = 1+(Math.PI*(n-1)*n/2)/(m-n) var a = x/y return a } function getScore(m, n, r) { return Math.abs(findA(m, n, r)*n/r-(5/7)) } function distribute(votes, seats) { // initial settings for divisor finding var voteSum = 0; for(var party in votes){ voteSum += votes[party] } var low = voteSum / (seats - 2) var high = voteSum / (seats + 2) var divisor = voteSum / seats var parliament = calculateSeats(votes, divisor) // find divisor while(parliament.seats != seats){ if(parliament.seats < seats) low = divisor if(parliament.seats > seats) high = divisor divisor = (low + high) / 2 parliament = calculateSeats(votes, divisor) } return parliament.distribution } function calculateSeats(votes, divisor) { var distribution = {} var seats = 0 for(var party in votes){ distribution[party] = Math.round(votes[party] / divisor) seats += distribution[party] } return {distribution, seats} } function getCoordinates(r, b) { var x = parseFloat(r * Math.cos(b/r - Math.PI)).toFixed(10); var y = parseFloat(r * Math.sin(b/r - Math.PI)).toFixed(10); return [x, y]; } function nextRing (rings, ringProgress) { var progressQuota, tQuota; for(var i in rings){ tQuota = parseFloat((ringProgress[i] || 0)/rings[i].length).toFixed(10); if(!progressQuota || tQuota d.value; const yValue = d => d.key; const margin = { top: 24, right: 20, bottom: 38, left: 240 }; const innerWidth = width - margin.left - margin.right; const innerHeight = height - margin.top - margin.bottom; const svg = d3.create("svg").attr("height", height).attr("width", width); const g = svg.append("g").attr("transform", `translate(${margin.left},${margin.top})`); const xScale = d3.scaleLinear().domain([0, d3.max(partyTotals, xValue)]).range([0, innerWidth]); const xAxis = d3.axisBottom(xScale).tickSize(-innerHeight); const yScale = d3.scaleBand().domain(partyTotals.map(yValue)).range([0, innerHeight]).padding(0.1); const xAxisG = g.append("g").call(xAxis) // create new group element and add an X Axis to it .attr("transform", `translate(0, ${innerHeight})`); xAxisG.select(".domain") // NB if we're just selecting one thing then use select otherwise selectAll .remove(); xAxisG.append("text").attr("x", innerWidth / 2).attr("y", 35).attr("fill", "black").text("Number of seats"); g.append("g").call(d3.axisLeft(yScale)) // create new group element and add a Y Axis to it .selectAll(".domain, .tick line") // inspect the DOM to find elements we want to remove .remove() // and delete them g.selectAll("rect").data(partyTotals).enter().append("rect") .attr("y", d => yScale(yValue(d))) .attr("width", d => xScale(xValue(d))) .attr("height", yScale.bandwidth) // .attr("fill", d => partyColours[ yValue(d) ]) .attr("fill", d => d.rgb) .append("title").text(d => xValue(d)); g.append("text").attr("y", -5).text("Total number of MPs per party"); return svg.node(); }32:T8b6,// html`

$${cabinet_data[i].pmLabel.value +$ //
//
${cabinet_data[i].pmLabel.value}
//
${cabinet_data[i].positionLabel.value}
//
//

` { const ul = d3.create("ul") // we're using d3.js to generate an HTML unordered list .attr("class", "image-list-small"); // to hold the images const li = ul.selectAll("li") // generate a HTML list tag (li) .data(cabinet_data) // for every row in cabinet_data .join("li"); // and append it to the DOM (actually the cell above) const a = li.append("a") // within each of these li tags, add an HTML anchor tag (a) .attr("href", d => d.pm.value) .attr("target", "_blank") const img = a.append("img") // with the anchor tag add an image tag .attr("width", imageCellWidth) // set its width .attr("id", (d,i) => `cabinet_image${i}`) // add an ID so that it can be identified when the // actual image has been downloaded .attr("src", function(d) { return d.local_image; // store the image data }) .attr("title", d => d.pmLabel.value + " : " + d.positionLabel.value) // add a title for hovering .attr("class", function(d) { if (cabinet_duplicates[d.positionLabel.value].length > 1) return "duplicate"; }); const div = li.append("div") // now just add some HTML tags within the list element to add .attr("class", "details"); // a caption with the politician's name and their position. div.append("h3") .text(d => d.pmLabel.value); div.append("p") .attr("class", "position") .text(d => d.positionLabel.value); return ul.node() } 33:T816,sparql = ` # put your SPARQL code between the backticks SELECT ?mp ?mpLabel ?constituency ?constituencyLabel ?partyTextLabel ?genderLabel ?rgb (SAMPLE(?age) AS ?age) WITH { # sample used as some people more than one date of birth/death SELECT ?parliament $DATE WHERE { VALUES $DATE { "${searchDate}"^^xsd:dateTime } VALUES $PARL_TERMS { wd:Q21094819 wd:Q21095053 } ?parliament wdt:P31 $PARL_TERMS . OPTIONAL { ?parliament wdt:P580 ?start_date } OPTIONAL { ?parliament wdt:P582 ?end_date } BIND(IF(!BOUND(?end_date), NOW(), ?end_date) AS ?end_date) FILTER (?start_date <= $DATE && ?end_date >= $DATE) }} AS %Parliament WHERE { INCLUDE %Parliament ?mp wdt:P31 wd:Q5 . ?mp p:P39 ?term_stmt . ?term_stmt ps:P39 ?term . ?term_stmt pq:P2937 ?parliament . OPTIONAL { ?term_stmt pq:P580 ?mp_start_date } OPTIONAL { ?term_stmt pq:P768 ?constituency } ?parliament wdt:P580 ?parliament_start . BIND(IF(!BOUND(?mp_start_date), ?parliament_start, ?mp_start_date) AS ?mp_start_date) OPTIONAL { ?term_stmt pq:P4100 ?party } OPTIONAL {?term_stmt pq:P582 ?mp_end_date } BIND(IF(!BOUND(?mp_end_date), NOW(), ?mp_end_date) AS ?mp_end_date) FILTER (?mp_start_date <= $DATE && ?mp_end_date >= $DATE) BIND(IF(BOUND(?party), ?party, wd:Q24238356) AS ?party) OPTIONAL { ?party wdt:P465 ?rgb } BIND(IF(BOUND(?rgb), ?rgb, "808080") AS ?rgb) OPTIONAL { ?mp wdt:P21 ?gender } BIND(IF(BOUND(?gender), ?gender, wd:Q24238356) AS ?gender) BIND ( IF (?party = wd:Q6467393 ,wd:Q9630, ?party) as ?partyText) # merge Labour Co-operative into Labour OPTIONAL { ?mp wdt:P569 ?dob } OPTIONAL { ?mp wdt:P570 ?dod } BIND(IF(BOUND(?dod), ?dod, NOW()) AS ?dod) BIND(?dod - ?dob AS ?ageInDays). BIND(?ageInDays/365.2425 AS ?ageInYears). BIND(FLOOR(?ageInYears) AS ?age). BIND(IF(BOUND(?age), ?age, 0) AS ?age) SERVICE wikibase:label { bd:serviceParam wikibase:language "[AUTO_LANGUAGE],en". } } GROUP BY ?mp ?mpLabel ?constituency ?constituencyLabel ?partyTextLabel ?genderLabel ?rgb `; // put your SPARQL code between the backticks34:[] 2e:{"id":"1656b997ff8d07c1","slug":"uk-parliament-party-totals","title":"UK Parliament Party Totals","thumbnail":"a3b677ef701f059a4b266e7070413509dbe20baf3ecf0b0cb527b41f37a5bdda","access_level":"public","create_time":"$D2022-02-10T04:58:10.487Z","update_time":"$D2022-02-16T08:21:05.523Z","view_time":null,"first_public_time":"$D2022-06-17T04:22:03.389Z","has_unpublished_edits":null,"fork":{"id":"603fe727deb9df89","slug":"uk-parliament-party-totals","title":"UK Parliament Party Totals","owner":{"id":"c8d5affa9ac0cb84","login":"piecesofuk","name":""}},"stars":0,"starred":false,"owner":{"type":"team","id":"7632798b0a0057f3","login":"joaormendes","name":"João Ricardo Mendes","avatar_url":"https://avatars-next.observableusercontent.com/5a37070bf9e58604859ec9aa7033b0dcb40e61c4ff0aeaba33424ba04567b1fd","tier":"pro_2024"},"version":1091,"publish_version":1091,"role":null,"authored":false,"authors":[{"type":"individual","id":"fb55e01b401bd78d","login":"joaohurb","name":"João Ricardo Hurb Com","avatar_url":"https://avatars-next.observableusercontent.com/5a37070bf9e58604859ec9aa7033b0dcb40e61c4ff0aeaba33424ba04567b1fd","tier":null}],"members":[{"type":"individual","id":"fb55e01b401bd78d","login":"joaohurb","name":"João Ricardo Hurb Com","avatar_url":"https://avatars-next.observableusercontent.com/5a37070bf9e58604859ec9aa7033b0dcb40e61c4ff0aeaba33424ba04567b1fd","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"UK Parliament Party Totals","cells":[{"id":88,"value":"md`# UK Parliament Party Totals \ncreated with Observable, using d3.js for the visualisations and DOM manipulation, with live data from Wikidata using the Wikidata Query Service (WDQS)`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":404,"value":"md`### Select a parliament start date from the drop down\nthe drop down is generated via a WDQS call (see Appendix A). The date can also be changed using the date picker.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":753,"value":"viewof searchDate = {\n const div = html` \n \n Date: \n \n`;\n const terms_drop = div.querySelector(\"#terms\");\n const date = div.querySelector(\"#date\");\n div.value\t = terms.value\t = date.value\t = dates[0];\n terms_drop.oninput = () => date.value = div.value = terms_drop.value\t;\n date.oninput = () => div.value = date.value\t;\n\nreturn div;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":262,"value":"//md` A total of ${data.length} MPs was returned`\n{\n let comment = \"\";\n if (searchDate < \"1831-12-31\") comment = \"(Note: The data is very incomplete before about 1830, but gradually improving)\";\n if (data.length == 0) {\n return md`No MPs were found. This could be because: the date was during an election period and so there were \n no MPs; the data for the MPs has not been entered on Wikidata yet; the date entered is outside the valid range\n for UK parliaments; there was an error with the WDQS.`\n }\n else return md`${data.length} MPs were found on Wikidata for ${searchDate} ${comment}`\n\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":890,"value":"$30","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":921,"value":"md`## Filters`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":924,"value":"viewof selectParty = select({\n title: \"Filter by party\",\n description: \"use SHIFT and/or CTRL to select multiple parties\",\n options: parties,\n multiple: true,\n value: parties\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":931,"value":"viewof selectGender = select({\n title: \"Filter by gender\",\n description: \"use SHIFT and/or CTRL to select multiple genders\",\n options: genders,\n multiple: true,\n value: genders\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":955,"value":"viewof selectAge = rangeSlider({\n min: 0,\n max: 120,\n // Note that values must be specified as array of length 2.\n value: this ? this.value : [0, 120],\n // Custom slider CSS, replaces all styles.\n theme: themes[theme],\n // Overrides the range color. Support for range colors is up to the theme.\n color,\n format: 'd',\n precision: 0,\n title: 'Filter by age',\n description: 'Approximate age now (if alive); approximate age at death.',\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":446,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":660,"value":"md`# Members of the Cabinet on ${searchDate}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":636,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":518,"value":"md`## Appendix A\n#### Generate data to construct the Parliamentary Terms drop down menu\nRun a SPARQL query via the WDQS to get all the parliamentary terms (I'm using position Member of Parliament); store the term label in the **terms** array and the corresponding start dates in the **dates** array These fields are used to generate the drop down at the top of the notebook`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":290,"value":"terms_sparql = \n` # put your SPARQL code between the backticks\nSELECT ?term ?termLabel ?start WHERE {\n VALUES $PARLIAMENTS {wd:Q21094819 wd:Q21095053 }\n ?term wdt:P31 $PARLIAMENTS .\n ?term wdt:P580 ?start .\n SERVICE wikibase:label { bd:serviceParam wikibase:language \"[AUTO_LANGUAGE],en\". }\n}\nORDER BY ?start \n`; // put your SPARQL code between the backticks","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":580,"value":"md`This is the object returned from the WDQS`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":298,"value":"terms_json = fetch(`https://query.wikidata.org/sparql?query=${encodeURIComponent(terms_sparql)}`, {headers: {accept: \"application/sparql-results+json\"}}).then(response => response.json())","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":584,"value":"md`Store the array of ${terms_data.length} objects`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":305,"value":"terms_data = terms_json.results.bindings; ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":588,"value":"md`Extract the name of the parliaments from their Wikidata labels, reverse order, extract the name and add start date`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":372,"value":"terms = terms_data.map(term => term.termLabel.value + \" (\" + term.start.value.substr(0, 10) +\")\").reverse();","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":377,"value":"md`Extract the corresponding start dates of the parliaments`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":415,"value":"//dates = terms_data.map(term => term.start.value).reverse();\ndates = terms_data.map(term => term.start.value.substr(0, 10)).reverse();","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1006,"value":"//number_of_seats = terms_data.map(term => term.number_of_seats.value).reverse();","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":389,"value":"md`# Appendix B\n#### Get everyone who was an MP on a particular date\nRun a SPARQL query via the WDQS to get everyone who was an MP on a particular date and store them in the **data** array. Note that **searchDate** is embedded in the SPARQL query below using a template literal; the query will automatically rerun whenever a new item it selected in the drop-down menu`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":412,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3,"value":"json = fetch(`https://query.wikidata.org/sparql?query=${encodeURIComponent(sparql)}`, {headers: {accept: \"application/sparql-results+json\"}}).then(response => response.json())","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":29,"value":"data = json.results.bindings;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":606,"value":"md` build an array of party totals with their party colour (if stored on Wikidata)`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":439,"value":"// needs reworking as pretty inefficient\npartyTotals = {\n let t = d3.nest().key(d => d.partyTextLabel.value).rollup(d => d.length).entries(data).sort( (a,b) => b.value-a.value);\n for (let i = 0; i < t.length; i++ ) {\n for (let j = 0; j < data.length; j++) {\n if (t[i].key == data[j].partyTextLabel.value) {\n t[i].rgb = \"#\" + data[j].rgb.value;\n break;\n }\n }\n \n }\n return t;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":625,"value":"md`# Appendix C\nGet the members of the cabinet`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":628,"value":"cabinet_sparql = `\n\nSELECT ?pm ?pmLabel ?pm_start $DATE ?pm_end ?position ?positionLabel (SAMPLE(?image) AS ?image) WHERE {\n VALUES $DATE { \"${searchDate}\"^^xsd:dateTime } \n ?pm wdt:P31 wd:Q5 .\n ?pm p:P39 ?ph_stmt .\n ?ph_stmt a wikibase:BestRank .\n ?ph_stmt ps:P39 ?position .\n ?position wdt:P361 wd:Q112014 .\n ?ph_stmt pq:P580 ?pm_start .\n OPTIONAL { ?ph_stmt pq:P582 ?pm_end }\n BIND(IF(!BOUND(?pm_end), NOW(), ?pm_end) AS ?pm_end)\n OPTIONAL { ?pm wdt:P18 ?img }\n BIND(IF(BOUND(?img),?img, ) as ?image)\n FILTER (?pm_start <= $DATE && ?pm_end >= $DATE)\n SERVICE wikibase:label { bd:serviceParam wikibase:language \"[AUTO_LANGUAGE],en\". }\n} GROUP BY ?pm ?pmLabel ?pm_start $DATE ?pm_end ?position ?positionLabel\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":630,"value":"cabinet_json = fetch(`https://query.wikidata.org/sparql?query=${encodeURIComponent(cabinet_sparql)}`, {headers: {accept: \"application/sparql-results+json\"}}).then(response => response.json())","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":634,"value":"//cabinet_data = cabinet_json.results.bindings;\n\ncabinet_data = {\n for (let i = 0; i < cabinet_json.results.bindings.length; i++) {\n let d = cabinet_json.results.bindings[i];\n // using the image on Wikidata (if it exists) we can request a small thumbnail from the Wikimedia API\n d.image_name = d.image.value.substring(d.image.value.match(\"FilePath\").index + 9);\n d.lookup_url = `https://en.wikipedia.org/w/api.php?action=query` +\n `&iilimit=1&prop=imageinfo` +\n `&iiprop=extmetadata|url|size|canonicaltitle` +\n `&iiurlwidth=${imageWidth}&format=json` +\n `&origin=*` +\n `&titles=File:${d.image_name}`; \n fetch(d.lookup_url, {headers: { accept: \"application/json\"}}).then(response => response.json()).then( j => {\n var key = Object.keys(j.query.pages);\n fetchImage(j.query.pages[key].imageinfo[0].thumburl, d, `cabinet_image${i}` ); \n\n });\n }\n return cabinet_json.results.bindings;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":830,"value":"cabinet_duplicates = {\n \n const check = {};\n for (let d of cabinet_data) {\n if (d.positionLabel.value in check) check[d.positionLabel.value].push(d);\n else check[d.positionLabel.value] = [d];\n }\n return check;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":846,"value":"md`# Appendix D\nsome variables and utiliy functions`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":825,"value":"imageWidth = 75;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":827,"value":"imageCellWidth = imageWidth * 1.5;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":841,"value":"md`image fetch code from https://developers.google.com/web/ilt/pwa/working-with-the-fetch-api#example_fetching_images`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":839,"value":" function logResult(result) {\n console.log(result);\n }","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":837,"value":" \nfunction logError(error) {\n console.log('Looks like there was a problem: \\n', error);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":835,"value":"function validateResponse(response) {\n if (!response.ok) {\n throw Error(response.statusText);\n }\n return response;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":833,"value":"function readResponseAsBlob(response) {\n return response.blob();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":832,"value":"function fetchImage(pathToResource, item, id) {\n fetch(pathToResource)\n .then(validateResponse)\n .then(readResponseAsBlob)\n .then(d => {\n// if (!do_not_load_images) {\n item.local_image = URL.createObjectURL(d);\n var sel = d3.select(`#${id}`);\n sel.attr(\"src\", item.local_image);\n// }\n })\n .catch(logError);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":926,"value":"parties = partyTotals.map(( t,i) => t.key);","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":932,"value":"genders = { \nlet aSet = new Set();\n\nfor (let i = 0; i < data.length; i++) {\n aSet.add(data[i].genderLabel.value);\n}\n return Array.from(aSet);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":222,"value":"md`# Appendix E\nimport the d3.js library and input utilities`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":281,"value":"d3 = require(\"d3@5\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":699,"value":"import {date} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":928,"value":"import {select} from \"@jashkenas/inputs\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":952,"value":"import {rangeSlider, color, themes, theme} from \"@mootari/range-slider\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":532,"value":"md`# Appendix F\nthe stylesheet used to format the visualisations`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":459,"value":" html``\n\n ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":849,"value":"md`# Appendix G\n## Attribution`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":851,"value":"html`This Observable notebook was created by Chris Groves (piecesofuk): Twitter, Wikidata, Wikipedia )`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":853,"value":"md`All images are via Wikimedia Commons: you can check the attribution of any image via the politician's Wikidata item`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":885,"value":"md` Hemicycle Visualisation based on code at https://github.com/Teester/parliament-diagram-generator/blob/master/script.js, which is based on https://github.com/juliuste/parliament-svg`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":855,"value":"html`

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W34","stdlib":"1"}} 2f:"$2e:body"

${cabinet_data[i].pmLabel.value}