30:T119b,plot = Plot.plot({ height: 440, width: 680, marginTop: 40, marginLeft: 120, marginRight: 60, fontFamily: "FFDaxPro", style: { fontSize: 14, fontFamily: "FFDaxPro" }, x: { // axis: null, ticks: 0, label: "Flexibilität →" }, y: { // axis: null, ticks: 0, label: "↑ Benutzerfreundlichkeit" }, color: { type: "identity" }, marks: [ Plot.ruleX([0]), Plot.ruleY([0]), Plot.text( [ { x: 0.42, y: 0.42, quadrant: "nicht benutzen" }, { x: 0.48, y: 0.48, quadrant: "benutzen" }, ], { x: "x", y: "y", text: "quadrant", textAnchor: "end", fill: (d) => (d.quadrant === "benutzen" ? "#559bd5" : "red"), rotate: 36.6, fontSize: 13, fontFamily: "FFDaxPro" } ), Plot.text( [ { x: 0, y: 0.8, quadrant: "intuitiv &\nprägnant" }, { x: 0, y: 0.2, quadrant: "schwer erlernbar &\nwortreich" }, { x: 0.2, y: -0.05, quadrant: "limitiert" }, { x: 0.8, y: -0.05, quadrant: "stark" } ], { x: "x", y: "y", text: "quadrant", dx: -10, textAnchor: "end", fontSize: 13, fontFamily: "FFDaxPro" } ), Plot.areaX( [ { x: 0, y: 1 }, { x: 0.1, y: 0.9 }, { x: 0.7, y: 0.7 }, { x: 0.9, y: 0.1 }, { x: 1, y: 0 } ], { x: "x", y: "y", curve: "cardinal", fill: "#e0e0e0", fillOpacity: 0.5 } ), Plot.line( [ { x: 0, y: 0.665 }, { x: 0.05, y: 0.685 }, { x: 0.10, y: 0.665 }, { x: 0.15, y: 0.685 }, { x: 0.20, y: 0.665 }, { x: 0.25, y: 0.685 }, { x: 0.30, y: 0.665 }, { x: 0.35, y: 0.685 }, { x: 0.40, y: 0.665 }, { x: 0.45, y: 0.685 }, { x: 0.50, y: 0.665 }, { x: 0.55, y: 0.685 }, { x: 0.60, y: 0.665 }, { x: 0.65, y: 0.685 }, { x: 0.70, y: 0.665 }, { x: 0.75, y: 0.685 }, { x: 0.80, y: 0.665 }, { x: 0.825, y: 0.675 }, // { x: 0.80, y: 0.665 }, // { x: 0.85, y: 0.685 }, // { x: 0.90, y: 0.665 }, ], { x: "x", y: "y", curve: "cardinal", strokeDasharray: 4, stroke: "#559bd5", } ), Plot.text( [ { x: 0.84, y: 0.675, quadrant: "↓ Coding" }, ], { x: "x", y: "y", text: "quadrant", textAnchor: "start", fontSize: 13, fontFamily: "FFDaxPro", fill: "#559bd5", } ), Plot.dot(dots, { x: "x", y: "y", stroke: (d) => (["ggplot2", "vega-lite", "Plot"].includes(d.vis) ? "#72bb6f" : "grey"), href: (d) => `${d.url}`, r: 4.5 }), Plot.text(dots, { x: (d) => ["ggplot2", "Flourish", "Highcharts", "Excel"].includes(d.vis) ? d.x - (d.vis.length / 66) - 0.01 : d.x, y: (d) => d.vis === "ggplot2" ? d.y - 0.00 : d.vis === "Excel" ? d.y - 0.04 : d.vis === "vega-lite" ? d.y + 0.00 : d.y, text: "vis", dx: 10, textAnchor: "start", fontSize: 13, fontFamily: "FFDaxPro", fill: (d) => (["ggplot2", "vega-lite", "Plot"].includes(d.vis) ? "#72bb6f" : "grey"), href: (d) => `${d.url}`, // pointerEvents: "none", }), Plot.rect( [ { x1: 0.515, y1: 0.55, x2: 0.81, y2: 0.65} ],{ x1: "x1", // or ([x1]) => x1 y1: "y1", // or ([, y1]) => y1 x2: "x2", // or ([,, x2]) => x2 y2: "y2", // or ([,,, y2]) => y2 stroke: "#72bb6f", strokeDasharray: 4, }), Plot.text( [ { x: 0.54, y: 0.52, quadrant: "Grammar of Graphics" }, ], { x: "x", y: "y", text: "quadrant", textAnchor: "start", fontSize: 13, fontFamily: "FFDaxPro", fill: "#72bb6f", } ), Plot.line( [ { x: 0, y: 0.9 }, { x: 0.9, y: 0 } ], { x: "x", y: "y", stroke: "gray", strokeDasharray: 4 } ), Plot.tip(dots, Plot.pointer({ x: "x", y: "y", title: d => `${d.Vorteile}\n―――――――――――――――――――――――\n${d.Nachteile}`, stroke: "transparent", fontSize: 13, lineWidth: 22 })), ] })31:[{"id":"c6d3cb1eef3aa7e8047f4b2e4ed8a4e7999b6f3055b4353e613b4fda6f112a306d9067160e776c813bca4bf908f7a5d3d3292f38a38b96fb4e9ce1af923d1386","href":"https://static.observableusercontent.com/files/c6d3cb1eef3aa7e8047f4b2e4ed8a4e7999b6f3055b4353e613b4fda6f112a306d9067160e776c813bca4bf908f7a5d3d3292f38a38b96fb4e9ce1af923d1386","name":"ds_data_de.csv","type":"text/csv","lastModified":1710432669743.763,"size":5483}] 2e:{"title":"Plot of Plots","cells":[{"id":0,"value":"\n# Plot of Plots\n\n## DS-Webgrafik\n","pinned":false,"hidden":false,"mode":"md"},{"id":321,"value":"title = htl.html`\n

Plot of Plots

Vergleich verschiedener Softwarepakete zur Erstellung von Datenvisualisierungen

\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":5,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":278,"value":"---\n\n\n# Appendix\n","pinned":false,"hidden":false,"mode":"md"},{"id":337,"value":"","pinned":false,"hidden":false,"mode":"html"},{"id":241,"value":"dots = FileAttachment(\"ds_data_de.csv\").csv({ typed: true})","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}