29:null 2a:["$","title",null,{"children":"Zensus Brandenburg Miete | RND | Observable"}] 2f:T26c0,zensus_brandenburg_chart = Plot.plot({ width, marginBottom: 40, marginTop: 40, insetBottom: 45, height: 400, x: { domain: [max_x * -1, max_x] }, y: { domain: brandenburg_stadt.map((d) => d.max).reverse(), axis: null }, marks: [ // Balken Stadteil Plot.rectX(brandenburg_stadtteil, { y: "max", x: (d) => d.prozent, fill: (d) => d.max < miete_qm ? "#4f80ff" : d.max == miete_qm ? "#99AFC2" : "#e84f1c", opacity: 0.8, dx: gap }), // Balken Stadt Plot.rectX(brandenburg_stadt, { y: "max", x: (d) => d.prozent * -1, fill: (d) => d.max < miete_qm ? "#4f80ff" : d.max == miete_qm ? "#99AFC2" : "#e84f1c", opacity: 0.8, dx: -gap }), // x-Achse Plot.axisX({ anchor: "bottom", grid: true, dx: gap, ticks: Array.from(Array(max_x / 10 + 1).keys()) .map((d) => d * 10) .filter((d) => d <= 100) .filter(function (_, i) { return i % 2 === 0; }), label: "← Bevölkerungsanteil in Prozent →", labelAnchor: "center" }), // Label y-Achse Plot.axisX({ anchor: "top", grid: false, ticks: [], label: "↑ Miete in Euro ↑", labelAnchor: "center" }), Plot.axisX({ anchor: "bottom", grid: false, dx: -gap, ticks: Array.from(Array(max_x / 10 + 1).keys()) .map((d) => d * -10) .filter((d) => d <= 100) .filter(function (_, i) { return i % 2 === 0; }), label: null, tickFormat: Math.abs }), // Linie für eigene Position Stadt Plot.ruleY(brandenburg_stadt, { filter: (d) => d.max == miete_qm, x1: (d) => d.prozent * -1, x2: -max_x, y: "max", dx: -gap }), // Linie für eigene Position Stadtteile Plot.ruleY(brandenburg_stadtteil, { filter: (d) => d.max == miete_qm, x1: (d) => d.prozent, x2: max_x, y: "max", dx: gap }), // Stroke für eigene Position Plot.rectX(brandenburg_stadtteil, { filter: (d) => d.max == miete_qm, y: "max", x: (d) => d.prozent, stroke: isDarkMode() ? "#ffffff" : "#0f151a", fillOpacityopacity: 0, dx: gap }), Plot.rectX(brandenburg_stadt, { filter: (d) => d.max == miete_qm, y: "max", x: (d) => d.prozent * -1, stroke: isDarkMode() ? "#ffffff" : "#0f151a", fillOpacityopacity: 0, dx: -gap }), // Text für eigene Position Plot.text([miete_qm], { x: max_x, dx: gap, y: miete_qm, textAnchor: "end", fill: "#0f151a", stroke: "#fff", dy: -10, text: (d) => (miete_select / wohnung_select).toLocaleString("de", { minimumFractionDigits: "2", maximumFractionDigits: "2" }) + " Euro" }), Plot.text([miete_qm], { x: -max_x, dx: -gap, y: miete_qm, textAnchor: "start", fill: "#0f151a", stroke: "#fff", dy: -10, text: (d) => (miete_select / wohnung_select).toLocaleString("de", { minimumFractionDigits: "2", maximumFractionDigits: "2" }) + " Euro" }), // y-Achsen Plot.ruleX([0], { x: 0, y1: "0", y2: "25", dx: -gap }), Plot.ruleX([0], { dx: gap }), Plot.ruleX([0], { dx: -gap }), // Label y-Achse Plot.text(brandenburg_stadt, { filter: (d) => d.max != 999, x: 0, y: "max", dy: -11, text: "max", textAnchor: "center", lineAnchor: "middle", strokeWidth: 0.5 }), // große Zahl Stadtteil mehr Plot.text([0], { dx: gap, y: 15, x: max_x, textAnchor: "end", lineAnchor: "middle", dy: -60, text: (d) => more_stadtteil.toLocaleString("de", { minimumFractionDigits: "1", maximumFractionDigits: "1" }) + "%", fill: "#e84f1c", stroke: "#fff", fontSize: 22, fontWeight: 600, fontFamily: "DIN Next LT Pro" }), // kleiner Text Stadtteil mehr Plot.text([0], { dx: gap, y: 15, x: max_x, fill: "#e84f1c", stroke: "#fff", textAnchor: "end", lineAnchor: "middle", dy: -45, text: (d) => "zahlen mehr" }), // große Zahl Stadt mehr Plot.text([0], { dx: -gap, y: 15, x: -max_x, textAnchor: "start", lineAnchor: "middle", dy: -60, text: (d) => more_stadt.toLocaleString("de", { minimumFractionDigits: "1", maximumFractionDigits: "1" }) + "%", fill: "#e84f1c", stroke: "#fff", fontSize: 22, fontWeight: 600, fontFamily: "DIN Next LT Pro" }), // kleiner Text Stadt mehr Plot.text([0], { dx: -gap, y: 15, x: -max_x, fill: "#e84f1c", stroke: "#fff", textAnchor: "start", lineAnchor: "middle", dy: -45, text: (d) => "zahlen mehr" }), // große Zahl Stadtteil ähnlich Plot.text([0], { dx: gap, y: miete_qm, x: max_x, textAnchor: "end", lineAnchor: "middle", dy: 15, text: (d) => equal_stadtteil.toLocaleString("de", { minimumFractionDigits: "1", maximumFractionDigits: "1" }) + "%", fill: "#99AFC2", stroke: "#fff", fontSize: 22, fontWeight: 600, fontFamily: "DIN Next LT Pro" }), // kleiner Text Stadtteil ähnlich Plot.text([0], { dx: gap, y: miete_qm, x: max_x, fill: "#99AFC2", stroke: "#fff", textAnchor: "end", lineAnchor: "middle", dy: 30, text: (d) => miete_qm == 0 ? "wohnen ebenfalls mietfrei" : "ähnlich viel" }), // große Zahl Stadt ähnlich Plot.text([0], { dx: -gap, y: miete_qm, x: -max_x, textAnchor: "start", lineAnchor: "middle", dy: 15, text: (d) => equal_stadt.toLocaleString("de", { minimumFractionDigits: "1", maximumFractionDigits: "1" }) + "%", fill: "#99AFC2", stroke: "#fff", fontSize: 22, fontWeight: 600, fontFamily: "DIN Next LT Pro" }), // kleiner Text Stadtteil ähnlich Plot.text([0], { dx: -gap, y: miete_qm, x: -max_x, fill: "#99AFC2", stroke: "#fff", textAnchor: "start", lineAnchor: "middle", dy: 30, text: (d) => miete_qm == 0 ? "wohnen ebenfalls mietfrei" : "ähnlich viel" }), // große Zahl Stadtteil weniger Plot.text([0], { dx: gap, y: 0, x: max_x, textAnchor: "end", lineAnchor: "middle", dy: 30, text: (d) => less_stadtteil.toLocaleString("de", { minimumFractionDigits: "1", maximumFractionDigits: "1" }) + "%", fill: "#4f80ff", fillOpacity: miete_qm == 0 ? 0 : 1, stroke: "#fff", strokeOpacity: miete_qm == 0 ? 0 : 1, fontSize: 22, fontWeight: 600, fontFamily: "DIN Next LT Pro" }), // kleiner Text Stadtteil weniger Plot.text([0], { dx: gap, y: 0, x: max_x, fill: "#4f80ff", fillOpacity: miete_qm == 0 ? 0 : 1, stroke: "#fff", strokeOpacity: miete_qm == 0 ? 0 : 1, textAnchor: "end", lineAnchor: "middle", dy: 45, text: (d) => "zahlen weniger" }), // große Zahl Stadt weniger Plot.text([0], { dx: -gap, y: 0, x: -max_x, textAnchor: "start", lineAnchor: "middle", dy: 30, text: (d) => less_stadt.toLocaleString("de", { minimumFractionDigits: "1", maximumFractionDigits: "1" }) + "%", fill: "#4f80ff", fillOpacity: miete_qm == 0 ? 0 : 1, stroke: "#fff", strokeOpacity: miete_qm == 0 ? 0 : 1, fontSize: 22, fontWeight: 600, fontFamily: "DIN Next LT Pro" }), // kleiner Text Stadt weniger Plot.text([0], { dx: -gap, y: 0, x: -max_x, fill: "#4f80ff", fillOpacity: miete_qm == 0 ? 0 : 1, stroke: "#fff", strokeOpacity: miete_qm == 0 ? 0 : 1, textAnchor: "start", lineAnchor: "middle", dy: 45, text: (d) => "zahlen weniger" }), // Tooltip Stadteil Plot.tip( brandenburg_stadtteil, Plot.pointerY({ y: "max", anchor: "left", x: 0, dx: gap, fill: isDarkMode() ? "#293845" : "#ffffff", fillOpacity: 0.8, fontSize: 12, strokeOpacity: 0.5, title: (d) => `${d.stadt}\n${d.stadtteil}\n${d.miete}\n\n${d.prozent.toLocaleString( "de", { minimumFractionDigits: 1, maximumFractionDigits: 1 } )} Prozent\n${d.zahl.toLocaleString("de")} ${haushalte_select.replace( "Insgesamt", "Haushalte" )}` }) ), // Tooltip Stadt Plot.tip( brandenburg_stadt, Plot.pointerY({ y: "max", anchor: "right", x: 0, dx: -gap, fill: isDarkMode() ? "#293845" : "#ffffff", fillOpacity: 0.8, fontSize: 12, strokeOpacity: 0.5, title: (d) => `${d.stadt}\n${d.stadtteil}\n${d.miete}\n\n${d.prozent.toLocaleString( "de", { minimumFractionDigits: 1, maximumFractionDigits: 1 } )} Prozent\n${d.zahl.toLocaleString("de")} ${haushalte_select.replace( "Insgesamt", "Haushalte" )}` }) ) ] })30:T13e1,style = html`

`31:[{"id":"196abbb6e55e063cee6d51688b1993bf20a4f2dd40e221e08b147d3b0de1b45e49b44c744b2254726cc10ec372018383028bc1a677ecfc7f11bef5633aba2641","href":"https://static.observableusercontent.com/files/196abbb6e55e063cee6d51688b1993bf20a4f2dd40e221e08b147d3b0de1b45e49b44c744b2254726cc10ec372018383028bc1a677ecfc7f11bef5633aba2641","name":"brandenburg_zensus@4.csv","type":"text/csv","lastModified":1732463136785.465,"size":1897529}] 2d:{"id":"d6a156fc32494d8a","slug":null,"title":"Zensus Brandenburg Miete","thumbnail":"f0918eb897b048e4022d120f5a4c3d86703fe742112ed61f917dcfa002fe2ab5","access_level":"public","create_time":"$D2024-11-20T08:56:18.393Z","update_time":"$D2026-01-29T09:53:26.730Z","view_time":null,"first_public_time":"$D2025-02-10T08:52:57.518Z","fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"b8db01b7dd27a055","login":"rnd","name":"RND","avatar_url":"https://avatars-next.observableusercontent.com/8cd6e8f8a280701f2c59b563c390950d7287c4e64c058ec466b6042ca5b6e9e1","tier":"starter_2024"},"version":1080,"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}],"members":[{"type":"individual","id":"5f9b41b7f852d3da","login":"rnd","name":"RND","avatar_url":"https://avatars-next.observableusercontent.com/8cd6e8f8a280701f2c59b563c390950d7287c4e64c058ec466b6042ca5b6e9e1","tier":null,"role":"editor"},{"type":"team","id":"b8db01b7dd27a055","login":"rnd","name":"RND","avatar_url":"https://avatars-next.observableusercontent.com/8cd6e8f8a280701f2c59b563c390950d7287c4e64c058ec466b6042ca5b6e9e1","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":4,"collection":null,"type":"notebook","body":{"title":"Zensus Brandenburg Miete","cells":[{"id":0,"value":"# Zensus Brandenburg Miete","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":948,"value":"stadt = new URLSearchParams(document.location.search).get(\"stadt\") ??\n \"Potsdam\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":944,"value":"stadtteil = new URLSearchParams(document.location.search).get(\"stadtteil\") ??\n \"Babelsberg Nord\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":608,"value":"zensus_brandenburg_title = html`\n

Mieten in Brandenburg

\n Geben Sie Miethöhe und Wohnungsgröße ein und lassen Sie sich die Werte einordnen\n

\n `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":69,"value":"viewof miete_select = Inputs.range([0, 2500], {\n label: \"Nettokaltmiete pro Monat in Euro\",\n step: 1,\n value: 700\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":78,"value":"viewof wohnung_select = Inputs.range([1, 250], {\n label: \"Wohnungsgröße in Quadratmetern\",\n step: 1,\n value: 70\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":83,"value":"answer = md`Die monatliche Nettokaltmiete pro Quadratmeter beträgt ${(\n miete_select / wohnung_select\n).toLocaleString(\"de\", {\n minimumFractionDigits: \"2\",\n maximumFractionDigits: \"2\"\n})}\nEuro.\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":26,"value":"stadt_stadtteil_select = html`

\n ${viewof stadt_select}\n

\n ${viewof stadtteil_select}\n

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":93,"value":"$2f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":746,"value":"viewof haushalte_select = {\n const p = Inputs.radio(\n [\n \"Insgesamt\",\n \"Paare mit Kindern\",\n \"Kinderlose Paare\",\n \"Alleinerziehende\",\n \"Singlehaushalte\",\n \"Wohngemeinschaften\"\n ],\n {\n label: \"\",\n value: \"Insgesamt\"\n }\n );\n d3.select(p)\n .select(\"div\")\n .style(\"column-count\", width < 500 ? 1 : 1);\n d3.select(p).selectAll(\"label\").style(\"display\", \"block\");\n return p;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":606,"value":"zensus_brandenburg_credits = md`

Grafik: MAZ/Christ • Quelle: Statistisches Bundesamt

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":314,"value":"miete_qm = (Math.round(miete_select / wohnung_select) < 4) &\n(Math.round(miete_select / wohnung_select) > 0)\n ? 4\n : Math.round(miete_select / wohnung_select) > 15\n ? 999\n : (miete_select / wohnung_select > 0) & (miete_select / wohnung_select < 0.5)\n ? 4\n : Math.round(miete_select / wohnung_select)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":366,"value":"equal_stadt = brandenburg_stadt.filter((d) => d.max == miete_qm)[0].prozent","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":373,"value":"equal_stadtteil = brandenburg_stadtteil.filter((d) => d.max == miete_qm)[0].prozent","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":376,"value":"more_stadt = d3.sum(\n brandenburg_stadt.filter((d) => d.max > miete_qm).map((d) => d.prozent)\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":380,"value":"more_stadtteil = d3.sum(\n brandenburg_stadtteil.filter((d) => d.max > miete_qm).map((d) => d.prozent)\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":383,"value":"less_stadt = d3.sum(\n brandenburg_stadt.filter((d) => d.max < miete_qm).map((d) => d.prozent)\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":385,"value":"less_stadtteil = d3.sum(\n brandenburg_stadtteil.filter((d) => d.max < miete_qm).map((d) => d.prozent)\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":671,"value":"new Set(zensus_brandenburg.map((d) => d.stadt))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":42,"value":"viewof stadt_select = Inputs.select(\n new Set(zensus_brandenburg.map((d) => d.stadt)),\n { label: \"Stadt:\", value: stadt }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":46,"value":"viewof stadtteil_select = Inputs.select(\n new Set(\n zensus_brandenburg\n .filter((d) => (d.stadtteil != \"Insgesamt\") & (d.stadt == stadt_select))\n .map((d) => d.stadtteil)\n ),\n { label: \"Stadtteil:\", value: stadtteil }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":193,"value":"gap = 12","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"zensus_brandenburg_data = FileAttachment(\"brandenburg_zensus@4.csv\").csv()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"zensus_brandenburg = zensus_brandenburg_data.map((d) => ({\n ...d,\n prozent: +d.prozent,\n zahl: +d.zahl,\n gesamt: +d.gesamt,\n min: +d.min,\n max: +d.max\n}))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":98,"value":"brandenburg_stadtteil = zensus_brandenburg\n .filter(\n (d) =>\n (d.stadtteil == stadtteil_select) &\n (d.stadtteil != \"Insgesamt\") &\n (d.stadt == stadt_select)\n )\n .filter((d) => d.kategorie == haushalte_select)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":100,"value":"brandenburg_stadt = zensus_brandenburg\n .filter((d) => (d.stadt == stadt_select) & (d.stadtteil == \"Insgesamt\"))\n .filter((d) => d.kategorie == haushalte_select)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":220,"value":"max_x = Math.ceil(d3.max(brandenburg_stadt.concat(brandenburg_stadtteil).map((d) => d.prozent)) / 10) * 10 +\n 10","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":761,"value":"import { view } from \"@tomlarkworthy/view\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":65,"value":"isDarkMode = () =>\n window.matchMedia && window.matchMedia(\"(prefers-color-scheme: dark)\").matches","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":779,"value":"ns = Inputs.text().classList[0]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"$30","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W31","stdlib":"1","titling":"auto"}} 2e:"$2d:body"