25:["$","title",null,{"children":"Stadtteile im Vergleich | RND | Observable"}] 4b:T8c1,stadtteil_vergleich = html`

${title_stadtteile_vergleich}

${viewof stadt_input} ${viewof stadtteil_input} ${stadt_map}

${viewof stadt_compare_input}
${stadt_compare_map}

${stadt_title} ${table_stadt}

${stadt_compare_title} ${table_stadt_compare}

${credits_stadtteile} ${text_stadtteile_migration}

${title_stadtteile_migration} ${stadt_migration_legend}

${stadt_input}
<- ohne Migration | mit Migration ->

${stadt_migration_plot}

${stadt_compare_input}
<- ohne Migration | mit Migration ->

${stadt_compare_migration_plot}

${text_stadtteile_haushalte}

${title_stadtteile_haushalte} ${stadt_haushalte_legend}

${stadt_input}
<- ohne Kinder | mit Kindern ->

${stadt_haushalte_plot}

${stadt_compare_input}
<- ohne Kinder | mit Kindern ->

${stadt_compare_haushalte_plot}

${text_stadtteile_distanz}

${title_stadtteile_distanz}

${scatter_distanz_singles}

${scatter_distanz_familien}

${text_stadtteile_wahlen}

${title_stadtteile_wahlen}

${viewof select_grüne} ${scatter_grüne}

${viewof select_union} ${scatter_union}

`4c:T40d,SELECT * FROM (SELECT distinct Stadtteil, Stadt, 'Alleinerziehende' AS Indikator, Alleinerziehende AS Wert FROM stadt_haushalte_anteil UNION SELECT distinct Stadtteil, Stadt, 'andere Haushalte mit Kindern' AS Indikator, "andere Haushalte mit Kindern" AS Wert FROM stadt_haushalte_anteil UNION SELECT distinct Stadtteil, Stadt, 'Single-Haushalte' AS Indikator, Singles AS Wert FROM stadt_haushalte_anteil UNION SELECT distinct Stadtteil, Stadt, 'Mehrpersonenhaushalte ohne Kinder' AS Indikator, "Mehrpersonenhaushalte ohne Kinder" AS Wert FROM stadt_haushalte_anteil UNION SELECT distinct Stadtteil, Stadt, 'Haushalte mit Kindern' AS Indikator, "Haushalte mit Kindern" AS Wert FROM stadt_haushalte_anteil) ORDER BY CASE Indikator WHEN 'Alleinerziehende' THEN 1 WHEN 'andere Haushalte mit Kindern' THEN 2 WHEN 'Single-Haushalte' THEN 3 WHEN 'Mehrpersonenhaushalte ohne Kinder' THEN 4 ELSE 5 END ASC , Indikator ASC4d:T8ba,stadt_haushalte_plot = addTooltips( Plot.plot({ height: length_stadtteil_haushalte * 15 + 30, width: chart_width, marginLeft: margin_left, marginRight: margin_right, marginTop: 10, marginBottom: 20, color: { legend: false, domain: ["Single-Haushalte", "Mehrpersonenhaushalte ohne Kinder", "Alleinerziehende", "andere Haushalte mit Kindern"], range: ["#4f80ff", "#80A3FF", "#e84f1c", "#F0C1B2"] }, y: { label: null, grid: false, tickSize: 0, axis: null }, x: { label: null, grid: false, axis: "bottom", domain: [-100,100], tickFormat: Math.abs }, marks: [ Plot.barX(stadt_haushalte_anteil_long.filter(d => d.Indikator !== "Haushalte mit Kindern" & d.Stadt === stadt_input), { y: d => d.Stadtteil, x: "Wert", fill: "Indikator", opacity: 0.9, sort: {y: "x", reverse: true} }), Plot.barX(stadt_haushalte_anteil_long.filter(d => (d.Stadtteil === stadtteil_input & d.Indikator !== "Haushalte mit Kindern") & d.Stadt === stadt_input), { y: d => d.Stadtteil, x: "Wert", fill: "black", opacity: 0.2, sort: {y: "x", reverse: true} }), Plot.text(stadt_haushalte_anteil_long.filter(d => d.Indikator === "Haushalte mit Kindern" & d.Stadt === stadt_input), { y: d => d.Stadtteil, x: d => d.Wert, textAnchor: "start", dx: 3, text: (d) => `${d.Wert.toLocaleString("de", {minimumFractionDigits: 0, maximumFractionDigits: 0})}` }), Plot.text(stadt_haushalte_anteil_long.filter(d => d.Indikator === "Haushalte mit Kindern" & d.Stadt === stadt_input), { y: d => d.Stadtteil, x: d => - (100 - d.Wert), textAnchor: "end", dx: -3, text: (d) => `${(100 - d.Wert).toLocaleString("de", {minimumFractionDigits: 0, maximumFractionDigits: 0})}` }), Plot.axisY({opacity: 0}), Plot.text(stadt_haushalte_anteil_long.filter(d => d.Indikator === "Haushalte mit Kindern" & d.Stadt === stadt_input), { y: d => d.Stadtteil, x: d => - (100 - d.Wert), textAnchor: "start", fill: "#fff", dx: 3, text: (d) => `${d.Stadtteil.split('/')[0]}` }) ] }))4e:Ta29,stadt_compare_haushalte_plot = addTooltips( Plot.plot({ height: length_stadtteil_compare_haushalte * 15 + 30, width: chart_width, marginLeft: margin_left, marginRight: margin_right, marginTop: 10, marginBottom: 20, color: { legend: false, domain: ["Single-Haushalte", "Mehrpersonenhaushalte ohne Kinder", "Alleinerziehende", "andere Haushalte mit Kindern"], range: ["#4f80ff", "#80A3FF", "#e84f1c", "#F0C1B2"] }, y: { label: null, grid: false, tickSize: 0, axis: null }, x: { label: null, grid: false, axis: "bottom", domain: [-100,100], tickFormat: Math.abs }, marks: [ Plot.barX(stadt_haushalte_anteil_long.filter(d => d.Indikator !== "Haushalte mit Kindern" & d.Stadt === stadt_compare_input), { y: d => d.Stadtteil, x: "Wert", fill: "Indikator", opacity: 0.9, sort: {y: "x", reverse: true} }), Plot.barX(stadt_haushalte_anteil_long.filter(d => (d.Stadtteil === stadtteil_compare_input & d.Indikator !== "Haushalte mit Kindern") & d.Stadt === stadt_compare_input), { y: d => d.Stadtteil, x: "Wert", fill: "black", opacity: 0.2, sort: {y: "x", reverse: true} }), Plot.text(stadt_haushalte_anteil_long.filter(d => d.Indikator === "Haushalte mit Kindern" & d.Stadt === stadt_compare_input), { y: d => d.Stadtteil, x: d => d.Wert, textAnchor: "start", dx: 3, text: (d) => `${d.Wert.toLocaleString("de", {minimumFractionDigits: 0, maximumFractionDigits: 0})}` }), Plot.text(stadt_haushalte_anteil_long.filter(d => d.Indikator === "Haushalte mit Kindern" & d.Stadt === stadt_compare_input), { y: d => d.Stadtteil, x: d => - (100 - d.Wert), textAnchor: "end", dx: -3, text: (d) => `${(100 - d.Wert).toLocaleString("de", {minimumFractionDigits: 0, maximumFractionDigits: 0})}` }), Plot.text(stadt_migration_anteil_long.filter(d => d.Indikator === "Haushalte mit Kindern" & d.Stadt === stadt_compare_input), { y: d => d.Stadtteil, x: d => - (100 - d.Wert), textAnchor: "start", fill: "#fff", dx: 3, text: (d) => `${d.Stadtteil}` }), Plot.axisY({opacity: 0}), Plot.text(stadt_haushalte_anteil_long.filter(d => d.Indikator === "Haushalte mit Kindern" & d.Stadt === stadt_compare_input), { y: d => d.Stadtteil, x: d => - (100 - d.Wert), textAnchor: "start", fill: "#fff", dx: 3, text: (d) => `${d.Stadtteil.split('/')[0]}` }) ] }))4f:T891,stadt_migration_plot = addTooltips( Plot.plot({ height: length_stadtteil_migration * 15 + 30, width: chart_width, marginLeft: margin_left, marginRight: margin_right, marginTop: 10, marginBottom: 20, color: { legend: false, domain: ["Ausländer", "Deutsche mit Migrationshintergrund", "Deutsche ohne Migrationshintergrund"], range: ["#e84f1c", "#F0C1B2", "#4f80ff"] }, y: { label: null, grid: false, tickSize: 0, axis: null }, x: { label: null, grid: false, axis: "bottom", domain: [-100, 100], tickFormat: Math.abs }, marks: [ Plot.barX(stadt_migration_anteil_long.filter(d => d.Indikator !== "Migrationshintergrund" & d.Stadt === stadt_input), { y: d => d.Stadtteil, x: "Wert", fill: "Indikator", opacity: 0.9, sort: {y: "x", reverse: true} }), Plot.barX(stadt_migration_anteil_long.filter(d => (d.Stadtteil === stadtteil_input & d.Indikator !== "Migrationshintergrund") & d.Stadt === stadt_input), { y: d => d.Stadtteil, x: "Wert", fill: "black", opacity: 0.2, sort: {y: "x", reverse: true} }), Plot.text(stadt_migration_anteil_long.filter(d => d.Indikator === "Migrationshintergrund" & d.Stadt === stadt_input), { y: d => d.Stadtteil, x: d => d.Wert, textAnchor: "start", dx: 3, text: (d) => `${d.Wert.toLocaleString("de", {minimumFractionDigits: 0, maximumFractionDigits: 0})}` }), Plot.text(stadt_migration_anteil_long.filter(d => d.Indikator === "Migrationshintergrund" & d.Stadt === stadt_input), { y: d => d.Stadtteil, x: d => - (100 - d.Wert), textAnchor: "end", dx: -3, text: (d) => `${(100 - d.Wert).toLocaleString("de", {minimumFractionDigits: 0, maximumFractionDigits: 0})}` }), Plot.ruleX([0]), Plot.text(stadt_migration_anteil_long.filter(d => d.Indikator === "Migrationshintergrund" & d.Stadt === stadt_input), { y: d => d.Stadtteil, x: d => - (100 - d.Wert), fill: "#fff", textAnchor: "start", dx: 3, text: (d) => `${d.Stadtteil.split('/')[0]}` }) ] }))50:T8d5,stadt_compare_migration_plot = addTooltips( Plot.plot({ height: length_stadtteil_compare_migration * 15 + 30, width: chart_width, marginLeft: margin_left, marginRight: margin_right, marginTop: 10, marginBottom: 20, color: { legend: false, domain: ["Ausländer", "Deutsche mit Migrationshintergrund", "Deutsche ohne Migrationshintergrund"], range: ["#e84f1c", "#F0C1B2", "#4f80ff"] }, y: { label: null, grid: false, tickSize: 0, axis: null }, x: { label: null, grid: false, axis: "bottom", domain: [-100, 100], tickFormat: Math.abs }, marks: [ Plot.barX(stadt_migration_anteil_long.filter(d => d.Indikator !== "Migrationshintergrund" & d.Stadt === stadt_compare_input), { y: d => d.Stadtteil, x: "Wert", fill: "Indikator", opacity: 0.9, sort: {y: "x", reverse: true} }), Plot.barX(stadt_migration_anteil_long.filter(d => (d.Stadtteil === stadtteil_compare_input & d.Indikator !== "Migrationshintergrund") & d.Stadt === stadt_compare_input), { y: d => d.Stadtteil, x: "Wert", fill: "black", opacity: 0.2, sort: {y: "x", reverse: true} }), Plot.text(stadt_migration_anteil_long.filter(d => d.Indikator === "Migrationshintergrund" & d.Stadt === stadt_compare_input), { y: d => d.Stadtteil, x: d => d.Wert, textAnchor: "start", dx: 3, text: (d) => `${d.Wert.toLocaleString("de", {minimumFractionDigits: 0, maximumFractionDigits: 0})}` }), Plot.text(stadt_migration_anteil_long.filter(d => d.Indikator === "Migrationshintergrund" & d.Stadt === stadt_compare_input), { y: d => d.Stadtteil, x: d => - (100 - d.Wert), textAnchor: "end", dx: -3, text: (d) => `${(100 - d.Wert).toLocaleString("de", {minimumFractionDigits: 0, maximumFractionDigits: 0})}` }), Plot.ruleX([0]), Plot.text(stadt_migration_anteil_long.filter(d => d.Indikator === "Migrationshintergrund" & d.Stadt === stadt_compare_input), { y: d => d.Stadtteil, x: d => - (100 - d.Wert), textAnchor: "start", fill: "#fff", dx: 3, text: (d) => `${d.Stadtteil.split('/')[0]}` }) ] }))51:T769,scatter_distanz_singles = addTooltips( Plot.plot({ width, height: 250, marginLeft: 40, marginRight: 60, marginTop: 40, marginBottom: 40, x: { ticks: 3, grid: true, tickSize: 0, domain: [0, 22000], label: "Distanz ->", tickFormat: d => `${(d.toLocaleString("de"))}` }, y: { ticks: 4, grid: true, tickSize: 0, domain: [0, 80], label: "Single-Haushalte ↑", tickFormat: d => `${(d.toLocaleString("de"))}` }, marks: [ Plot.dot(stadtteile_distanz, { x: "Distanz", y: "Single-Haushalte", fill: "#4f80ff", fillOpacity: 0.1, stroke: "#4f80ff", strokeWidth: 0.5, strokeOpacity: 0.3, title: (d) => `${d.Stadt} \n ${d.Stadtteil}` }), Plot.density(stadtteile_distanz, { x: "Distanz", y: "Single-Haushalte", fillOpacity: 0, stroke: "#4f80ff", strokeWidth: 0.7, strokeOpacity: 0.5, thresholds: 10 }), Plot.dot(stadtteile_distanz.filter(d => (d.Stadt == stadt_input & d.Stadtteil == stadtteil_input) | (d.Stadt == stadt_compare_input & d.Stadtteil == stadtteil_compare_input)), { x: "Distanz", y: "Single-Haushalte", fill: "#0f151a", fillOpacity: 0.6, stroke: "#fff", strokeWidth: 0.5, strokeopacity: 0.9, title: (d) => `${d.Stadt} \n ${d.Stadtteil}` }), Plot.text(stadtteile_distanz.filter(d => (d.Stadt == stadt_input & d.Stadtteil == stadtteil_input) | (d.Stadt == stadt_compare_input & d.Stadtteil == stadtteil_compare_input)), { x: "Distanz", y: "Single-Haushalte", fill: "#0f151a", fillopacity: 0.9, textAnchor: "start", stroke: "#fff", dx: 5, text: (d) => `${d.Stadtteil}` }) ] }))52:T788,scatter_distanz_familien = addTooltips( Plot.plot({ width, height: 250, marginLeft: 40, marginRight: 60, marginTop: 40, marginBottom: 40, x: { ticks: 3, grid: true, tickSize: 0, domain: [0, 22000], label: "Distanz ->", tickFormat: d => `${(d.toLocaleString("de"))}` }, y: { ticks: 4, grid: true, tickSize: 0, domain: [0, 80], label: "Haushalte mit Kindern ↑", tickFormat: d => `${(d.toLocaleString("de"))}` }, marks: [ Plot.dot(stadtteile_distanz, { x: "Distanz", y: "Haushalte mit Kindern", fill: "#4f80ff", fillOpacity: 0.1, stroke: "#4f80ff", strokeWidth: 0.5, strokeOpacity: 0.3, title: (d) => `${d.Stadt} \n ${d.Stadtteil}` }), Plot.density(stadtteile_distanz, { x: "Distanz", y: "Haushalte mit Kindern", fillOpacity: 0, stroke: "#4f80ff", strokeWidth: 0.7, strokeOpacity: 0.5, thresholds: 10 }), Plot.dot(stadtteile_distanz.filter(d => (d.Stadt == stadt_input & d.Stadtteil == stadtteil_input) | (d.Stadt == stadt_compare_input & d.Stadtteil == stadtteil_compare_input)), { x: "Distanz", y: "Haushalte mit Kindern", fill: "#0f151a", fillOpacity: 0.6, stroke: "#fff", strokeWidth: 0.5, strokeopacity: 0.9, title: (d) => `${d.Stadt} \n ${d.Stadtteil}` }), Plot.text(stadtteile_distanz.filter(d => (d.Stadt == stadt_input & d.Stadtteil == stadtteil_input) | (d.Stadt == stadt_compare_input & d.Stadtteil == stadtteil_compare_input)), { x: "Distanz", y: "Haushalte mit Kindern", fill: "#0f151a", fillopacity: 0.9, textAnchor: "start", stroke: "#fff", dx: 5, text: (d) => `${d.Stadtteil}` }) ] }))53:T7a2,scatter_grüne = addTooltips( Plot.plot({ width, height: 300, marginLeft: 40, marginRight: 60, marginTop: 10, marginBottom: 40, x: { ticks: 5, grid: true, tickSize: 0, domain: [0, 50], tickFormat: d => `${(d.toLocaleString("de"))}` }, y: { ticks: 4, grid: true, tickSize: 0, domain: [25, 65], tickFormat: d => `${(d.toLocaleString("de"))}` }, marks: [ Plot.dot(stadtteile_durchschnittsalter, { x: select_grüne, y: "Durchschnittsalter", fill: color_scatter_grüne, fillOpacity: 0.15, stroke: color_scatter_grüne, strokeWidth: 0.5, strokeOpacity: 0.4, title: (d) => `${d.Stadt} \n ${d.Stadtteil}` }), Plot.density(stadtteile_durchschnittsalter, { x: select_grüne, y: "Durchschnittsalter", fill: color_scatter_grüne, fillOpacity: 0, stroke: color_scatter_grüne, strokeWidth: 0.7, strokeOpacity: 0.5, thresholds: 10 }), Plot.dot(stadtteile_durchschnittsalter.filter(d => (d.Stadt == stadt_input & d.Stadtteil == stadtteil_input) | (d.Stadt == stadt_compare_input & d.Stadtteil == stadtteil_compare_input)), { x: select_grüne, y: "Durchschnittsalter", fill: "#0f151a", fillOpacity: 0.6, stroke: "#fff", strokeWidth: 1, strokeopacity: 0.9, title: (d) => `${d.Stadt} \n ${d.Stadtteil}` }), Plot.text(stadtteile_durchschnittsalter.filter(d => (d.Stadt == stadt_input & d.Stadtteil == stadtteil_input) | (d.Stadt == stadt_compare_input & d.Stadtteil == stadtteil_compare_input)), { x: select_grüne, y: "Durchschnittsalter", fill: "#0f151a", fillopacity: 0.9, textAnchor: "start", stroke: "#fff", dx: 5, text: (d) => `${d.Stadtteil}` }) ] }))54:T794,scatter_union = addTooltips( Plot.plot({ width, height: 300, marginLeft: 40, marginRight: 60, marginTop: 10, marginBottom: 40, x: { ticks: 5, grid: true, tickSize: 0, domain: [0, 50], tickFormat: d => `${(d.toLocaleString("de"))}` }, y: { ticks: 4, grid: true, tickSize: 0, domain: [25, 65], tickFormat: d => `${(d.toLocaleString("de"))}` }, marks: [ Plot.dot(stadtteile_durchschnittsalter, { x: select_union, y: "Durchschnittsalter", fill: color_scatter_union, fillOpacity: 0.15, stroke: color_scatter_union, strokeWidth: 0.5, strokeOpacity: 0.4, title: (d) => `${d.Stadt} \n ${d.Stadtteil}` }), Plot.density(stadtteile_durchschnittsalter, { x: select_union, y: "Durchschnittsalter", fill: color_scatter_union, fillOpacity: 0, stroke: color_scatter_union, strokeWidth: 0.5, strokeOpacity: 0.5, thresholds: 10 }), Plot.dot(stadtteile_durchschnittsalter.filter(d => (d.Stadt == stadt_input & d.Stadtteil == stadtteil_input) | (d.Stadt == stadt_compare_input & d.Stadtteil == stadtteil_compare_input)), { x: select_union, y: "Durchschnittsalter", fill: "#0f151a", fillOpacity: 0.6, stroke: "#fff", strokeWidth: 1, strokeopacity: 0.9, title: (d) => `${d.Stadt} \n ${d.Stadtteil}` }), Plot.text(stadtteile_durchschnittsalter.filter(d => (d.Stadt == stadt_input & d.Stadtteil == stadtteil_input) | (d.Stadt == stadt_compare_input & d.Stadtteil == stadtteil_compare_input)), { x: select_union, y: "Durchschnittsalter", fill: "#0f151a", fillopacity: 0.9, textAnchor: "start", stroke: "#fff", dx: 5, text: (d) => `${d.Stadtteil}` }) ] }))55:T718,text_stadtteile_migration = html`

Beispielsweise findet der Hannoveraner Stadtteil Linden-Nord seine Entsprechung im Kölner Stadtteil Neuehrenfeld. Der Stimmenanteil der Grünen bei der Bundestagswahl 2021 ist in beiden Quartieren außerordentlich hoch, der Anteil der AfD hingegen sehr gering. Beide Viertel haben vergleichsweise viele junge und wenig alte Einwohner, beheimaten wenige Familien, aber viele Singles. Ein ähnliches Milieu findet sich unter anderem in der Hamburger Sternschanze und im Bremer Steintor.

Auf eine vollkommen andere Nachbarschaft deuten die Daten im Fall des Kölner Villenviertels Hahnwald hin. Dort kommt die FDP auf fast 30 Prozent der Stimmen, es gibt viele Senioren, viele Autos, wenige Singles und eine Menge Platz zum Leben. Jeder Einwohner verfügt dort im Durchschnitt über mehr als 90 Quadratmetern Wohnfläche. In diese Größenordnung fällt sonst nur der Stadtteil Am Bismarckturm in Stuttgart.

Migrantenanteil in ${stadtteil_compare_input} ist ${stadtteil_compare_migration[0].Einordnung_Compare}

Das Kontrastprogramm zum Luxus-Viertel bietet Köln-Chorweiler, wo die Einwohner im Durchschnitt auf lediglich 28 Quadratmetern Wohnfläche leben. Den Stadtteil weit draußen im Norden verbinden die Kölner mit Hochhaus-Tristesse. Der Anteil der AfD-Wähler ist mit 13,6 Prozent sehr hoch, ebenso die Arbeitslosenquote und die Zahl der Menschen mit Migrationshintergrund. 81 Prozent der Einwohner von Chorweiler haben eine Zuwanderungsgeschichte.

Um die in den folgenden Grafiken angezeigten Städte zu ändern, wählen sie weiter oben im Vergleichsrechner andere Städte aus.

`56:T58c,table_stadt = md` ${stadtteile_answer_text.map(stadtteile_answer_text => htl.html``)}

${stadtteile_answer_text["Indikator"].replace('Distanz', 'Distanz zur Stadtmitte in m').replace('Durchschnittsalter', 'Durchschnittsalter in Jahren').replace('Anteil AfD', 'Anteil AfD in %').replace('Anteil FDP', 'Anteil FDP in %').replace('Anteil Grüne', 'Anteil Grüne in %').replace('Anteil Linke', 'Anteil Linke in %').replace('Anteil SPD', 'Anteil SPD in %').replace('Anteil Union', 'Anteil Union in %').replace('Arbeitslose', 'Arbeitslosenquote in %').replace('Beschäftigte', 'Beschäftigtenquote in %').replace('Migrationshintergrund', 'Einwohner mit Migrationshintergrund').replace('Kraftfahrzeuge', kraftfahrzeuge_stadt).replace('Einwohner 65 und älter', über_65).replace('Einwohner unter 18', unter_18).replace('Geburten', 'Geburten pro Jahr').replace('Sterbefälle', 'Sterbefälle pro Jahr').replace('Wanderungssaldo', 'Wanderungssaldo pro Jahr')}
${stadtteile_answer_text.Wert.toLocaleString("de")}

${stadtteile_answer_text["Einordnung"]}

`57:T5ed,table_stadt_compare = md` ${stadtteile_answer_compare_text.map(stadtteile_answer_compare_text => htl.html``)}

${stadtteile_answer_compare_text["Indikator_Compare"].replace('Distanz', 'Distanz zur Stadtmitte in m').replace('Durchschnittsalter', 'Durchschnittsalter in Jahren').replace('Anteil AfD', 'Anteil AfD in %').replace('Anteil FDP', 'Anteil FDP in %').replace('Anteil Grüne', 'Anteil Grüne in %').replace('Anteil Linke', 'Anteil Linke in %').replace('Anteil SPD', 'Anteil SPD in %').replace('Anteil Union', 'Anteil Union in %').replace('Arbeitslose', 'Arbeitslosenquote in %').replace('Beschäftigte', 'Beschäftigtenquote in %').replace('Migrationshintergrund', 'Einwohner mit Migrationshintergrund').replace('Kraftfahrzeuge', kraftfahrzeuge_stadt).replace('Einwohner 65 und älter', über_65).replace('Einwohner unter 18', unter_18).replace('Geburten', 'Geburten pro Jahr').replace('Sterbefälle', 'Sterbefälle pro Jahr').replace('Wanderungssaldo', 'Wanderungssaldo pro Jahr')}
${stadtteile_answer_compare_text.Wert_Compare.toLocaleString("de")}

${stadtteile_answer_compare_text["Einordnung_Compare"]}

`58:Tce3,addTooltips = (chart, styles) => { const stroke_styles = { stroke: "#4f80ff", "stroke-width": 2, "stroke-opacity": 1 }; const fill_styles = { fill: "#4f80ff", "fill-opacity": 0.5 }; // Workaround if it's in a figure const type = d3.select(chart).node().tagName; let wrapper = type === "FIGURE" ? d3.select(chart).select("svg") : d3.select(chart); // Workaround if there's a legend.... const svgs = d3.select(chart).selectAll("svg"); if (svgs.size() > 1) wrapper = d3.select([...svgs].pop()); wrapper.style("overflow", "visible"); // to avoid clipping at the edges // Set pointer events to visibleStroke if the fill is none (e.g., if its a line) wrapper.selectAll("path").each(function (data, index, nodes) { // For line charts, set the pointer events to be visible stroke if ( d3.select(this).attr("fill") === null || d3.select(this).attr("fill") === "none" ) { d3.select(this).style("pointer-events", "visibleStroke"); if (styles === undefined) styles = stroke_styles; } }); if (styles === undefined) styles = fill_styles; const tip = wrapper .selectAll(".hover") .data([1]) .join("g") .attr("class", "hover") .style("pointer-events", "none") .style("text-anchor", "middle"); // Add a unique id to the chart for styling const id = id_generator(); // Add the event listeners d3.select(chart).classed(id, true); // using a class selector so that it doesn't overwrite the ID wrapper.selectAll("title").each(function () { // Get the text out of the title, set it as an attribute on the parent, and remove it const title = d3.select(this); // title element that we want to remove const parent = d3.select(this.parentNode); // visual mark on the screen const t = title.text(); if (t) { parent.attr("__title", t).classed("has-title", true); title.remove(); } // Mouse events parent .on("pointerenter pointermove", function (event) { const text = d3.select(this).attr("__title"); const pointer = d3.pointer(event, wrapper.node()); if (text) tip.call(hover, pointer, text.split("\n")); else tip.selectAll("*").remove(); // Raise it d3.select(this).raise(); // Keep within the parent horizontally const tipSize = tip.node().getBBox(); if (pointer[0] + tipSize.x < 0) tip.attr( "transform", `translate(${tipSize.width / 2}, ${pointer[1] + 7})` ); else if (pointer[0] + tipSize.width / 2 > wrapper.attr("width")) tip.attr( "transform", `translate(${wrapper.attr("width") - tipSize.width / 2}, ${ pointer[1] + 7 })` ); }) .on("pointerout", function (event) { tip.selectAll("*").remove(); // Lower it! d3.select(this).lower(); }); }); // Remove the tip if you tap on the wrapper (for mobile) wrapper.on("touchstart", () => tip.selectAll("*").remove()); // Define the styles chart.appendChild(html`

${domain.map(value => { const label = `${format(value)}`; return htl.html`

${label}

`; })}

`; return htl.html`

${domain.map(value => htl.html`${format(value)}`)}

`; }5a:T149f,style = html`

`5b:[{"id":"b2776993cc22d5b12149b0ba67e4fb7c2b4b7cfbfb8349848dd5552b20dbd5ce5cb9ebb31117ac80c1227b63fa9de88289b6c727c15b10bf335761496b147cd3","href":"https://static.observableusercontent.com/files/b2776993cc22d5b12149b0ba67e4fb7c2b4b7cfbfb8349848dd5552b20dbd5ce5cb9ebb31117ac80c1227b63fa9de88289b6c727c15b10bf335761496b147cd3","name":"Stadtteile_geo@1.geojson","type":"application/geo+json","lastModified":1678877686391.026,"size":21658341},{"id":"d3c344ddc3e948b25ecc84506cbc1125c5e531de1e23a9d8d76868d15a8bd3ef576ef6eabb69cc8c986dfde6d6782acafb1ef076f7275e56985b42f27157d315","href":"https://static.observableusercontent.com/files/d3c344ddc3e948b25ecc84506cbc1125c5e531de1e23a9d8d76868d15a8bd3ef576ef6eabb69cc8c986dfde6d6782acafb1ef076f7275e56985b42f27157d315","name":"stadtteile_long@5.csv","type":"text/csv","lastModified":1679327018096.697,"size":1700986},{"id":"7fb6fd5dcfbf2aa7b7e34c1ca16f72ce7085ae80875a77e2b222d4b74c3a36ba8b61b309444d3d328593ba6d7edc5da6805015a1f66d51cdefc3bdf944fcefdd","href":"https://static.observableusercontent.com/files/7fb6fd5dcfbf2aa7b7e34c1ca16f72ce7085ae80875a77e2b222d4b74c3a36ba8b61b309444d3d328593ba6d7edc5da6805015a1f66d51cdefc3bdf944fcefdd","name":"stadtteile_median_long@6.csv","type":"text/csv","lastModified":1679327028923.492,"size":2200883},{"id":"df022251ad817d3f3867c41d4967c41bb87ced9207598fd2869480a0740927af3394b0b8208b224e4b7be2d8000434d9be13b274f0645e7f36cc620399f754ea","href":"https://static.observableusercontent.com/files/df022251ad817d3f3867c41d4967c41bb87ced9207598fd2869480a0740927af3394b0b8208b224e4b7be2d8000434d9be13b274f0645e7f36cc620399f754ea","name":"stadtteile_ranking@4.csv","type":"text/csv","lastModified":1679327036235.213,"size":519705}] 47:{"id":"eb7e4fb5b5ca45ea","slug":"stadtteil-vergleich","title":"Stadtteile im Vergleich","thumbnail":"49e3b8e7b5c25c76853ac31b4ed41e895e2facb91573182f4e68e995d0ccb899","access_level":"public","create_time":"$D2023-03-09T08:07:25.435Z","update_time":"$D2025-04-07T13:35:17.219Z","view_time":null,"first_public_time":"$D2023-03-27T10:50:11.508Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"b8db01b7dd27a055","login":"rnd","name":"RND","avatar_url":"https://avatars-next.observableusercontent.com/8cd6e8f8a280701f2c59b563c390950d7287c4e64c058ec466b6042ca5b6e9e1","tier":"starter_2024","bio":"RedaktionsNetzwerk Deutschland","followed_by_you":false,"follows_you":false},"version":4712,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"5f9b41b7f852d3da","login":"rnd","name":"RND","avatar_url":"https://avatars-next.observableusercontent.com/8cd6e8f8a280701f2c59b563c390950d7287c4e64c058ec466b6042ca5b6e9e1","tier":null,"bio":"RedaktionsNetzwerk Deutschland","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"5f9b41b7f852d3da","login":"rnd","name":"RND","avatar_url":"https://avatars-next.observableusercontent.com/8cd6e8f8a280701f2c59b563c390950d7287c4e64c058ec466b6042ca5b6e9e1","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Stadtteile im Vergleich","cells":[{"id":0,"value":"# Stadtteile im Vergleich","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1079,"value":"$4b","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2620,"value":"SELECT Stadt, Stadtteil,\n MAX(CASE WHEN Indikator = 'Alleinerziehende' THEN Wert ELSE NULL END) Alleinerziehende,\n MAX(CASE WHEN Indikator = 'Haushalte' THEN Wert ELSE NULL END) Haushalte,\n MAX(CASE WHEN Indikator = 'Haushalte mit Kindern' THEN Wert ELSE NULL END) \"Haushalte mit Kindern\",\n MAX(CASE WHEN Indikator = 'Single-Haushalte' THEN Wert ELSE NULL END) \"Single-Haushalte\",\n MAX(CASE WHEN Indikator = 'Migrationshintergrund' THEN Wert ELSE NULL END) \"Migrationshintergrund\",\n MAX(CASE WHEN Indikator = 'Ausländer' THEN Wert ELSE NULL END) \"Ausländer\",\n MAX(CASE WHEN Indikator = 'Einwohner' THEN Wert ELSE NULL END) \"Einwohner\",\nFROM stadtteile_ranking_long\nWHERE Stadt = ${stadt_input} \nOR Stadt = ${stadt_compare_input}\nGROUP BY Stadt, Stadtteil","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"stadt_ranking_wide","database":"var:stadtteile_ranking_long"},{"id":2745,"value":"SELECT \n Stadt, \n Stadtteil, \n (Alleinerziehende / Haushalte) * 100 as Alleinerziehende, \n (\"Single-Haushalte\" / Haushalte) * -100 as \"Singles\",\n (\"Haushalte mit Kindern\" - Alleinerziehende) / Haushalte * 100 as \"andere Haushalte mit Kindern\", \n (Haushalte - \"Single-Haushalte\" - \"Haushalte mit Kindern\" ) / Haushalte * -100 as \"Mehrpersonenhaushalte ohne Kinder\", \n (\"Haushalte mit Kindern\" / Haushalte * 100) as \"Haushalte mit Kindern\",\n FROM stadt_ranking_wide\n WHERE \"Haushalte mit Kindern\" IS NOT NULL\n AND \"Alleinerziehende\" IS NOT NULL\n AND \"Singles\" IS NOT NULL\n AND \"Mehrpersonenhaushalte ohne Kinder\" IS NOT NULL\n ORDER BY \"Haushalte mit Kindern\" desc","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"stadt_haushalte_anteil","database":"var:stadt_ranking_wide"},{"id":3260,"value":"length_stadtteil_haushalte = stadt_haushalte_anteil.filter(d => d.Stadt === stadt_input).length","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3511,"value":"length_stadtteil_migration = stadt_migration_anteil.filter(d => d.Stadt === stadt_input).length","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3263,"value":"length_stadtteil_compare_haushalte = stadt_haushalte_anteil.filter(d => d.Stadt === stadt_compare_input).length","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3513,"value":"length_stadtteil_compare_migration = stadt_migration_anteil.filter(d => d.Stadt === stadt_compare_input).length","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3441,"value":"SELECT Stadt, Stadtteil, \n (\"Ausländer\" / Einwohner * 100) as \"Ausländer\",\n ((\"Migrationshintergrund\" - \"Ausländer\")/ Einwohner * 100) as \"Deutsche mit Migrationshintergrund\",\n ((\"Einwohner\" - \"Migrationshintergrund\") / Einwohner * -100) as \"Deutsche ohne Migrationshintergrund\",\n (\"Migrationshintergrund\"/ Einwohner * 100) as \"Migrationshintergrund\",\n FROM stadt_ranking_wide\n WHERE \"Ausländer\" IS NOT NULL\n AND \"Migrationshintergrund\" IS NOT NULL\n AND \"Einwohner\" IS NOT NULL\n ORDER BY \"Migrationshintergrund\" desc","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"stadt_migration_anteil","database":"var:stadt_ranking_wide"},{"id":2817,"value":"$4c","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"stadt_haushalte_anteil_long","database":"var:stadt_haushalte_anteil"},{"id":3445,"value":"SELECT *\nFROM\n (SELECT distinct Stadtteil, Stadt, 'Ausländer' AS Indikator, Ausländer AS Wert\n FROM stadt_migration_anteil\n UNION\n SELECT \n distinct Stadtteil, Stadt, 'Deutsche mit Migrationshintergrund' AS Indikator, \"Deutsche mit Migrationshintergrund\" AS Wert\n FROM stadt_migration_anteil\n UNION\n SELECT distinct Stadtteil, Stadt, 'Deutsche ohne Migrationshintergrund' AS Indikator, \"Deutsche ohne Migrationshintergrund\" AS Wert\n FROM stadt_migration_anteil\n UNION\n SELECT distinct Stadtteil, Stadt, 'Migrationshintergrund' AS Indikator, Migrationshintergrund AS Wert\n FROM stadt_migration_anteil)\n \nORDER BY \n CASE Indikator WHEN 'Ausländer' THEN 1\n WHEN 'Deutsche mit Migrationshintergrund' THEN 2\n WHEN 'Deutsche ohne Migrationshintergrund' THEN 3\n WHEN 'Migrationshintergrund' THEN 4\n ELSE 5 END ASC\n , Indikator ASC","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"stadt_migration_anteil_long","database":"var:stadt_migration_anteil"},{"id":3167,"value":"stadt_haushalte_legend = Swatches(d3.scaleOrdinal([\"Mehrpersonenhaushalte ohne Kinder\", \"Single-Haushalte\", \"Alleinerziehende\", \"andere Haushalte mit Kindern\"], [\"#80A3FF\", \"#4f80ff\", \"#e84f1c\", \"#F0C1B2\"]))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3573,"value":"margin_left = 25","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3593,"value":"margin_right = 25","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2764,"value":"$4d","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3222,"value":"$4e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3498,"value":"stadt_migration_legend = Swatches(d3.scaleOrdinal([\"Deutsche ohne Migrationshintergrund\", \"Ausländer\", \"Deutsche mit Migrationshintergrund\"], [\"#4f80ff\", \"#e84f1c\", \"#F0C1B2\"]))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3458,"value":"$4f","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3533,"value":"$50","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1141,"value":"stadtteile_ranking_long = FileAttachment(\"stadtteile_long@5.csv\").csv().then(\n function(data) {\n data.forEach(function(d) {\n d.Wert = +d.Wert;\n });\n return data;\n }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2050,"value":"stadtteile_ranking = FileAttachment(\"stadtteile_ranking@4.csv\").csv().then(\n function(data) {\n data.forEach(function(d) {\n d.Alleinerziehende = +d.Alleinerziehende;\n d[\"Haushalte mit Kindern\"] = +d[\"Haushalte mit Kindern\"];\n d[\"Einwohner unter 18\"] = +d[\"Einwohner unter 18\"];\n d[\"Einwohner 65 und älter\"] = +d[\"Einwohner 65 und älter\"];\n d.Kraftfahrzeuge = +d.Kraftfahrzeuge;\n d[\"Einwohner je km²\"] = +d[\"Einwohner je km²\"];\n });\n return data;\n }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2500,"value":"stadtteile_durchschnittsalter = stadtteile_ranking.filter(d => d.Durchschnittsalter != '')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2469,"value":"stadtteile_distanz = stadtteile_ranking.filter(d => (d.Distanz != '') & (d[\"Single-Haushalte\"] != '') & (d[\"Haushalte mit Kindern\"] != ''))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":4007,"value":"title_stadtteile_distanz = html`\n

\n
\n

Singles im Zentrum, Familien in der Peripherie

\n Anteile der Single-Haushalte und der Haushalte mit Familien an allen Haushalten in Prozent in Abhängigkeit von der Entfernung zur Stadtmitte in Metern\n

\n `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2390,"value":"$51","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":4428,"value":"$52","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2281,"value":"viewof select_grüne = Inputs.select([\"Anteil Union\", \"Anteil SPD\", \"Anteil Grüne\", \"Anteil FDP\", \"Anteil AfD\", \"Anteil Linke\"], {label: \"Partei auswählen\", value: \"Anteil Grüne\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2285,"value":"viewof select_union = Inputs.select([\"Anteil Union\", \"Anteil SPD\", \"Anteil Grüne\", \"Anteil FDP\", \"Anteil AfD\", \"Anteil Linke\"], {label: \"Partei auswählen\", value: \"Anteil Union\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2057,"value":"$53","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2256,"value":"$54","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2295,"value":"color_scatter_grüne = {if (select_grüne == \"Anteil Union\") {return \"#999999\"} else if (select_grüne == \"Anteil SPD\") {return \"#D52226\"} else if (select_grüne == \"Anteil Grüne\") {return \"#7ABA2D\"} else if (select_grüne == \"Anteil FDP\") {return \"#ffbf00\"} else if (select_grüne == \"Anteil AfD\") {return \"#4378C0\"} else {return \"#BC3475\"}}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2298,"value":"color_scatter_union = {if (select_union == \"Anteil Union\") {return \"#999999\"} else if (select_union == \"Anteil SPD\") {return \"#D52226\"} else if (select_union == \"Anteil Grüne\") {return \"#7ABA2D\"} else if (select_union == \"Anteil FDP\") {return \"#ffbf00\"} else if (select_union == \"Anteil AfD\") {return \"#4378C0\"} else {return \"#BC3475\"}}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2553,"value":"kraftfahrzeuge_stadt = {if (stadt_input == \"Dresden\" | stadt_input == \"Essen\" | stadt_input == \"München\" | stadt_input == \"Köln\" | stadt_input == \"Hamburg\") {return \"Kraftfahrzeuge (nur Pkw)\"} else {return \"Kraftfahrzeuge\"}}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2562,"value":"kraftfahrzeuge_stadt_compare = {if (stadt_compare_input == \"Dresden\" | stadt_compare_input == \"Essen\" | stadt_compare_input == \"München\" | stadt_compare_input == \"Köln\" | stadt_compare_input == \"Hamburg\") {return \"Kraftfahrzeuge (nur Pkw)\"} else {return \"Kraftfahrzeuge\"}}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2566,"value":"unter_18_compare = {if (stadt_compare_input == \"Münster\") {return \"Einwohner unter 19\"} else {return \"Einwohner unter 18\"}}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2568,"value":"unter_18 = {if (stadt_input == \"Münster\") {return \"Einwohner unter 19 Jahren\"} else {return \"Einwohner unter 18 Jahren\"}}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2572,"value":"über_65_compare = {if (stadt_compare_input == \"Münster\") {return \"Einwohner 60 und älter\"} else {return \"Einwohner 65 und älter\"}}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2575,"value":"über_65 = {if (stadt_input == \"Münster\") {return \"Einwohner 60 Jahre und älter\"} else {return \"Einwohner 65 Jahre und älter\"}}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1361,"value":"SELECT Stadt, Stadtteil, Indikator, Wert FROM stadtteile_ranking_long\n WHERE Stadt = ${stadt_input}\n AND Stadtteil = ${stadtteil_input}","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"stadtteil_ranking","database":"var:stadtteile_ranking_long"},{"id":1368,"value":"SELECT Stadt, Stadtteil, Indikator, Wert FROM stadtteile_ranking_long\n WHERE Stadt = ${stadt_compare_input}\n AND Stadtteil = ${stadtteil_compare_input}","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"stadtteil_compare_ranking","database":"var:stadtteile_ranking_long"},{"id":1377,"value":"db_stadtteil = DuckDBClient.of({ stadtteil_ranking, stadtteil_compare_ranking, stadtteil_median, stadtteil_compare_median })","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1386,"value":"SELECT a.Indikator, a.Stadtteil, a.Wert, c.Median as Median, b.Stadtteil as Stadtteil_Compare, b.Wert as Wert_Compare, d.Median as Median_Compare\n FROM stadtteil_ranking a\n JOIN stadtteil_compare_ranking b\n ON a.Indikator = b.Indikator\n JOIN stadtteil_median c\n ON a.Indikator = c.Indikator\n JOIN stadtteil_compare_median d\n ON a.Indikator = d.Indikator\n ORDER BY c.Indikator","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"stadtteile_answer_werte","database":"var:db_stadtteil"},{"id":1433,"value":"SELECT Indikator, Wert,\n CASE \n WHEN Median > 0.4 THEN 'sehr hoch'\n WHEN Median > 0.1 THEN 'hoch'\n WHEN Median <= 0.1 AND Median_Compare >= -0.1 THEN 'durchschnittlich'\n WHEN Median < -0.1 AND Median_Compare > -0.4 THEN 'niedrig'\n ELSE 'sehr niedrig'\n END AS Einordnung,\n CASE \n WHEN Median > 0.4 THEN '#e84f1c'\n WHEN Median > 0.1 THEN '#ff7842'\n WHEN Median <= 0.1 AND Median_Compare >= -0.1 THEN '#99AFC2'\n WHEN Median < -0.1 AND Median_Compare > -0.4 THEN '#7ca2ff'\n ELSE '#4f80ff'\n END AS Color\n FROM stadtteile_answer_werte;","pinned":false,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"stadtteile_answer_text","database":"var:stadtteile_answer_werte"},{"id":4537,"value":"SELECT * FROM stadtteile_answer_compare_text\n WHERE Indikator_Compare = ${\"Migrationshintergrund\"}","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"stadtteil_compare_migration","database":"var:stadtteile_answer_compare_text"},{"id":1527,"value":"SELECT Indikator as Indikator_Compare, Wert_Compare,\n CASE \n WHEN Median_Compare > 0.4 THEN 'sehr hoch'\n WHEN Median_Compare > 0.1 THEN 'hoch'\n WHEN Median_Compare <= 0.1 AND Median_Compare >= -0.1 THEN 'durchschnittlich'\n WHEN Median_Compare < -0.1 AND Median_Compare > -0.4 THEN 'niedrig'\n ELSE 'sehr niedrig'\n END AS Einordnung_Compare,\n CASE \n WHEN Median_Compare > 0.4 THEN '#e84f1c'\n WHEN Median_Compare > 0.1 THEN '#ff7842'\n WHEN Median_Compare <= 0.1 AND Median_Compare >= -0.1 THEN '#99AFC2'\n WHEN Median_Compare < -0.1 AND Median_Compare > -0.4 THEN '#7ca2ff'\n ELSE '#4f80ff'\n END AS Color_Compare\n FROM stadtteile_answer_werte;","pinned":false,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"stadtteile_answer_compare_text","database":"var:stadtteile_answer_werte"},{"id":250,"value":"städte_geo = rewind(await FileAttachment(\"Stadtteile_geo@1.geojson\").json())","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":260,"value":"stadt_geo = geo.filter(städte_geo, (d) => d.Stadt == stadt_input)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":451,"value":"stadt_compare_geo = geo.filter(städte_geo, (d) => d.Stadt == stadt_compare_input)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":205,"value":"stadtteil_geo = geo.filter(stadt_geo, (d) => d.Stadtteil == stadtteil_input)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":467,"value":"stadtteil_compare_geo = geo.filter(stadt_compare_geo, (d) => d.Stadtteil == stadtteil_compare_input)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1161,"value":"stadt = stadtteile_median_long.filter(d => d.Stadt === stadt_input)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":4082,"value":"stadtteile_median_long = FileAttachment(\"stadtteile_median_long@6.csv\").csv().then(\n function(data) {\n data.forEach(function(d) {\n d.Median = +d.Median;\n });\n return data;\n }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":718,"value":"SELECT Stadtteil, Indikator, Median FROM stadtteile_median_long\n WHERE Stadt = ${stadt_input}\n AND Stadtteil = ${stadtteil_input}","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"stadtteil_median","database":"var:stadtteile_median_long"},{"id":1352,"value":"SELECT Stadtteil, Indikator, Median FROM stadtteile_median_long\n WHERE Stadt = ${stadt_compare_input}\n AND Stadtteil = ${stadtteil_compare_input}","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"stadtteil_compare_median","database":"var:stadtteile_median_long"},{"id":800,"value":"db = DuckDBClient.of({ stadtteile_median_long, stadtteil_median })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":933,"value":"SELECT c.Stadt, c.Stadtteil, sum(abs(s.Median - c.Median)) as Difference FROM stadtteile_median_long c\n JOIN stadtteil_median s\n ON s.Indikator = c.Indikator\n WHERE c.Stadt = ${stadt_compare_input}\n GROUP BY c.Stadtteil, c.Stadt\n ORDER BY Difference","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"stadtteil_compare","database":"var:db"},{"id":1028,"value":"stadtteil_compare_input = stadtteil_compare[0].Stadtteil","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1704,"value":"title_stadtteile_vergleich = html`\n

\n
\n

Stadtteile im Vergleich

\n Wählen Sie einen Stadtteil aus und lassen sich anzeigen, welcher Stadtteil aus einer anderen Stadt diesem am ähnlichsten ist.\n

\n
\n

Wo wie viele Familien leben

\n Anteil der Haushalte mit und ohne Kinder in den Stadtteilen\n

\n
\n

Wo wie viele Migranten leben

\n Anteil der Einwohner mit und ohne Migrationshintergrund in den Stadtteilen\n

\n
\n

Welche Parteien stark sind

\n Stimmenanteil bei der Bundestagswahl 2021 in Prozent und Durchschnittsalter in Jahren in den Stadtteilen\n

${stadtteil_input}
${stadt_input}

\n
\n Innenstadtnahe Wohnlagen werden vor allem von ledigen, meist noch jüngeren Erwachsenen bevorzugt, während Paare mit und ohne Kinder nach wie vor überwiegend am Stadtrand leben, so das BBSR. Zuletzt haben auch die hohen Mieten dafür gesorgt, dass viele Familien ins Umland gezogen sind. Die Möglichkeit, mehr im Homeoffice arbeiten zu können, verstärkt diesen Trend.
\n

\n
\nDie Entfernung eines Stadtteils von der Innenstadt verrät nicht nur etwas darüber, wie viele Kinder dort leben, sondern auch darüber, wie die Einwohner politisch ticken. Das hat zuletzt die Landtagswahl in Berlin gezeigt, wo die CDU in den äußeren Bezirken deutlich stärker abgeschnitten hat als im Stadtzentrum, wo die Grünen ihre Hochburgen haben.

\n\n

Vororte schwarz, Innenstädte grün

\n\nAuch hinter der politischen Landkarte steht die Vorliebe jüngerer Menschen für die Innenstädte und der Drang der Älteren in die Vororte. Wie das Durchschnittsalter mit dem Wahlverhalten zusammenhängt, zeigt die folgende Grafik. Vor allem die Stimmenanteile der Union, aber auch der AfD nehmen mit einem höheren Durchschnittsalter zu. Die Grünen sind im Gegensatz dazu in der Regel bei Jüngeren stark.
\n

\n
\n Stand: 2021, außer Dortmund 2022 und Bielefeld, Dresden, Düsseldorf, Frankfurt, München und Stuttgart 2020. Wahlergebnisse nur für übergeordnete Bezirke: Bielefeld, Bochum, Bonn, Dortmund, Duisburg, Hannover, Stuttgart, Wuppertal. Dresden: Wanderungssaldo, Geburten und Sterbefälle Q1 bis Q3. Quellen: Statistikämter der Städte\n
\n
\n
\n

${stadtteil_compare_input}
${stadt_compare_input}

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1742,"value":"$56","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1745,"value":"$57","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":235,"value":"viewof stadt_input = Inputs.select(new Set(stadtteile_ranking_long.map(d => d.Stadt).sort()), {label: \"Stadt:\", value: \"Hannover\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":4699,"value":"new Set(stadtteile_ranking_long.map((d) => d.Stadt).sort())","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":225,"value":"viewof stadtteil_input = Inputs.select(new Set(stadt.map(d => d.Stadtteil).sort()), {label: \"Stadtteil:\", value: \"Linden-Nord\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":65,"value":"stadt_map = \n Plot.plot({\n \n width: chart_width, \n \n projection: { \n type: \"mercator\", \n domain: stadt_geo },\n \n color: {\n range: [\"#99AFC2\"],\n label: null,\n legend: false\n },\n marks: [\n\n Plot.geo(stadtteil_geo, { \n fill: \"#4f80ff\",\n opacity: 1\n }),\n \n Plot.geo(stadt_geo, { \n stroke: \"#fff\",\n fill: (d) => d.properties.Nummer,\n fillOpacity: 0.3,\n title: (d) => d.properties.Stadtteil\n }),\n\n Plot.text(\n stadtteil_geo.features,\n Plot.centroid({\n text: (d) => d.properties.Stadtteil,\n textAnchor: \"middle\",\n stroke: \"white\",\n fill: \"black\"\n })\n )\n \n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":448,"value":"viewof stadt_compare_input = Inputs.select(new Set(stadtteile_ranking_long.map(d => d.Stadt).sort()), {label: \"Stadt:\", value: \"Köln\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":446,"value":"stadt_compare_map = \n Plot.plot({\n \n width: chart_width, \n \n projection: { \n type: \"mercator\", \n domain: stadt_compare_geo },\n \n color: {\n range: [\"#99AFC2\"],\n label: null,\n legend: false\n },\n marks: [\n\n Plot.geo(stadtteil_compare_geo, { \n fill: \"#4f80ff\",\n opacity: 1\n }),\n \n Plot.geo(stadt_compare_geo, { \n stroke: \"#fff\",\n fill: (d) => d.properties.Nummer,\n fillOpacity: 0.3,\n title: (d) => d.properties.Stadtteil\n }),\n\n Plot.text(\n stadtteil_compare_geo.features,\n Plot.centroid({\n text: (d) => d.properties.Stadtteil,\n textAnchor: \"middle\",\n stroke: \"white\",\n fill: \"black\"\n })\n )\n \n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":152,"value":"geo = require(`geotoolbox@2`)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":307,"value":"$58","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":394,"value":"// Function to position the tooltip\nhover = (tip, pos, text) => {\n const side_padding = 10;\n const vertical_padding = 5;\n const vertical_offset = 15;\n\n // Empty it out\n tip.selectAll(\"*\").remove();\n\n // Append the text\n tip\n .style(\"text-anchor\", \"middle\")\n .style(\"pointer-events\", \"none\")\n .attr(\"transform\", `translate(${pos[0]}, ${pos[1] + 7})`)\n .selectAll(\"text\")\n .data(text)\n .join(\"text\")\n .style(\"dominant-baseline\", \"ideographic\")\n .text((d) => d)\n .attr(\"y\", (d, i) => (i - (text.length - 1)) * 15 - vertical_offset)\n .style(\"font-weight\", \"normal\");\n\n const bbox = tip.node().getBBox();\n\n // Add a rectangle (as background)\n tip\n .append(\"rect\")\n .attr(\"y\", bbox.y - vertical_padding)\n .attr(\"x\", bbox.x - side_padding)\n .attr(\"width\", bbox.width + side_padding * 2)\n .attr(\"height\", bbox.height + vertical_padding * 2)\n .style(\"fill\", \"white\")\n .style(\"stroke\", \"#d3d3d3\")\n .style(\"opacity\", 0.9)\n .lower();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":396,"value":"// To generate a unique ID for each chart so that they styles only apply to that chart\nid_generator = () => {\n var S4 = function () {\n return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);\n };\n return \"a\" + S4() + S4();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1217,"value":"import {rewind} from \"@fil/rewind\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1234,"value":"import {textcolor} from \"@observablehq/text-color-annotations-in-markdown\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1952,"value":"import { aq, op } from \"@uwdata/arquero\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1119,"value":"chart_width = {if(window.innerWidth < 500) {return window.innerWidth} else {return (window.innerWidth / 2) - 10}}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3165,"value":"$59","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":4696,"value":"stadtteil_meetup = html`\n\n

\n\n

\n ${title_stadtteile_vergleich}\n\n

\n ${viewof stadt_input}\n ${viewof stadtteil_input}\n ${stadt_map}\n

\n\n

\n ${viewof stadt_compare_input}\n
\n ${stadt_compare_map}\n

\n\n

\n ${stadt_title}\n ${table_stadt}\n

\n\n

\n ${stadt_compare_title}\n ${table_stadt_compare}\n

\n\n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":423,"value":"$5a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W5b","stdlib":"1"}} 24:null