25:["$","title",null,{"children":"Zweef je tussen twee partijen? Doe de themachecker | Wouter van Dijke | Observable"}] 49:Tf5e,chart = { // Specify the chart’s dimensions. const width = 1250; const height = 350; const marginTop = 25; const marginRight = 20; const marginBottom = 35; const marginLeft = 40; // Define the horizontal scale. const x = d3.scaleLinear() .domain(d3.extent(agreements, d => d.value)).nice() .range([marginLeft, width - marginRight]); // Define the vertical scale. const y = d3.scaleLinear() .domain([0.8,1.2]).nice() .range([height - marginBottom, marginTop]); const color = d3.scaleOrdinal() .domain(filtered.map(d => d.category)) .range(d3.schemeCategory10); // Create the container SVG. const svg = d3.create("svg") .attr("width", width) .attr("height", height) .attr("viewBox", [0, 0, width, height]) .attr("style", "max-width: 100%; height: auto;"); var div = svg.append("div") .attr("class", "tooltip") .style("position", "absolute") .style("opacity", 0); // Add the axes. svg.append("g") .attr("transform", `translate(0,${height - marginBottom})`) .call(d3.axisBottom(x)) .call(g => g.append("text") .attr("x", width-marginRight) .attr("y", marginBottom - 4) .attr("fill", "currentColor") .attr("text-anchor", "end") .text("Overeenkomst (%) →")); // svg.append("g") // .attr("transform", `translate(${marginLeft},0)`) // .call(d3.axisLeft(y)); // Append a circle for each data point. svg.append("g") .selectAll("circle") .data(filtered.filter(function(d) { if (d.category != 'overall') { return true; } else { return false; } })) .join("circle") .attr("cx", d => x(d.value)) .attr("cy", d => y(1)) .attr("r", 15) .attr("fill", d => color(d.category)) .on('mouseover', function(d, i) { // make the mouseover'd element bigger and add the label d3.select(this) .transition() .duration(100) .attr('r', 20); d3.select(this.parentNode) .attr("font-family", "sans-serif") .attr("font-size", 10) .append("text").text(i.category) .attr("dy", ".35em") .attr("x", d => x(i.value)) .attr("y", d => y(1.05)) .attr("text-anchor", "middle") d3.select(this.parentNode) .attr("font-family", "sans-serif") .attr("font-size", 10) .append("text").text(Math.round(i.value) + '%') .attr("dy", ".35em") .attr("x", d => x(i.value)) .attr("y", d => y(1)) .attr("text-anchor", "middle") }) .on('mouseout', function(d, i) { // return the mouseover'd element to original size d3.select(this) .transition() .duration(100) .attr('r', 15) d3.select(this.parentNode).selectAll('text').remove(); }); // add line for overall svg.append("g") .selectAll("line") .data(filtered.filter(function(d) { if (d.category == 'overall') { return true; } else { return false; } })) .join("line") .attr("x1", d => x(d.value)) //<<== change your code here .attr("y1", y(1.15)) .attr("x2", d => x(d.value)) //<<== and here .attr("y2", y(0.85)) .style("stroke-width", 1) .style("stroke", "black") .style("fill", "none") svg.append("g") .selectAll("line") .data(filtered.filter(function(d) { if (d.category == 'overall') { return true; } else { return false; } })) .join("text") .attr("font-family", "sans-serif") .attr("font-size", 10) .attr("x", d => x(d.value)) .attr("y", y(1.18)) .attr("fill", "currentColor") .attr("text-anchor", "middle") .text(d => "Overall: \n " + Math.round(d.value) + "%") return svg.node(); }4a:T8be,

Thema 1

Partij 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque efficitur lectus et eros dictum, at lacinia arcu gravida. Nullam ut nisl vel sapien sagittis molestie. Sed in ex tristique, consequat purus non, accumsan est.

Partij 2

Thema 2

Partij 1

Partij 2

Thema 3

Partij 1

Partij 2

4b:[{"id":"f5309ea11d21b7c04e93b1446a948c9fb871d2c05bb8c271d84f305c362e520f6aed87f7583da33ac1e33858095782d20e29bca0038ad2ba2ae8558aefbeb822","href":"https://static.observableusercontent.com/files/f5309ea11d21b7c04e93b1446a948c9fb871d2c05bb8c271d84f305c362e520f6aed87f7583da33ac1e33858095782d20e29bca0038ad2ba2ae8558aefbeb822","name":"agreements.json","type":"application/json","lastModified":1696513410079.009,"size":639067}] 29:{"id":"3e608be68a499559","slug":null,"title":"Zweef je tussen twee partijen? Doe de themachecker","thumbnail":"c213f0bd5a412b65ee167cd1e27c6095b40cc74cf171f68d6481f83b0c49a300","access_level":"public","create_time":"$D2023-10-05T13:43:30.079Z","update_time":"$D2023-10-12T08:05:06.431Z","view_time":null,"first_public_time":"$D2023-10-05T13:43:30.079Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"f722c0784d30b006","login":"woutervdijke","name":"Wouter van Dijke","avatar_url":"https://avatars-next.observableusercontent.com/e2ce1c54e2ec7ecbbb73bc0058e7287d8f52b4db4f12dcb30f71ac25f15148b4","tier":"starter_2024","bio":"","following":false},"version":533,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"f5d4403d41cb256c","login":"woutervdijke","name":"Wouter van Dijke","avatar_url":"https://avatars-next.observableusercontent.com/e2ce1c54e2ec7ecbbb73bc0058e7287d8f52b4db4f12dcb30f71ac25f15148b4","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"f5d4403d41cb256c","login":"woutervdijke","name":"Wouter van Dijke","avatar_url":"https://avatars-next.observableusercontent.com/e2ce1c54e2ec7ecbbb73bc0058e7287d8f52b4db4f12dcb30f71ac25f15148b4","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Zweef je tussen twee partijen? Doe de themachecker","cells":[{"id":0,"value":"# Zweef je tussen twee partijen? Doe de themachecker\n\nAls je nog twijfelt tussen twee partijen, is het goed om te weten over welke onderwerpen die partijen het meestal wél en niet eens zijn. Zo kun je focussen op de onderwerpen waar jouw stem het meeste verschil maakt. \n\nKies hieronder de twee partijen waar je tussen twijfelt:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":132,"value":"viewof radios = Inputs.radio(partijen, {label: \"Eerste partij:\", value: \"Omtzigt\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":135,"value":"viewof radios2 = Inputs.radio(partijen\n // .filter((partij) => partij != radios), // filter zodat je niet twee keer dezelfde partij kiest\n , {label: \"Tweede partij:\", value: \"VVD\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":429,"value":"\nHieronder zie je van alle thema's hoe vaak de partijen hetzelfde hebben gestemd in de Tweede Kamer. Druk op een stip om te zien om welk thema het gaat, en hoe vaak de partijen hetzelfde stemmen.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":2,"value":"$49","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":398,"value":"

Deze partijen zijn het het meest oneens over:

Nog meer weten?

Check onze verkiezingsvideo