2f:Tb48,plotData2 = function () { let d = data(); let e = []; let s = { soldatenInFolge: 0, nochEinSoldat: true, platzFürPanzer: true, nurNochLostPanzer: false, letzterPanzerWarLost: false, ausnahmeSoldat: false, lostSoldat: false, soldat: true, panzer: false, lostPanzer: false }; for (let y = 0; y < 300; y++) { for (let x = 0; x < width / xFac; x++) { let blocked = false; textfields.forEach((tf) => { if ( x * xFac >= tf[0] - padding && x * xFac <= tf[0] + tf[2] + padding && y * yFac >= tf[1] - padding && y * yFac <= tf[1] + tf[3] + padding ) { blocked = true; } }); if (blocked) { continue; } let debug = true; // Den State definieren // Immer 20 +/- 10 Soldaten in Folge s.nochEinSoldat = s.soldatenInFolge < 15 + (Math.random() - 0.5) * 7; // Am Ende der Zeile keine Panzer, damit sie nicht überhängen s.platzFürPanzer = x + 5 * zoomFac < width / xFac; // Am Anfang alle Panzer die nicht verloren wurden s.nurNochLostPanzer = d.tank.length == 0; // Hat es keinen Platz mehr für Panzer fügen wir einfach Soldaten ein, auch wenn der Zufall nein sagt // Nach einem verlorenen Panzer fügen wir einen verlorenen Soldaten ein s.lostSoldat = (s.letzterPanzerWarLost && s.soldatenInFolge < 6 && d.soldier_lost.length > 0) || (d.soldier.length == 0 && s.nochEinSoldat); s.soldat = (!s.lostSoldat && s.nochEinSoldat && d.soldier.length > 0) || (d.soldier_lost.length == 0 && s.nochEinSoldat); s.panzer = !s.nochEinSoldat && s.platzFürPanzer && !s.nurNochLostPanzer && d.tank.length > 0; s.lostPanzer = !s.nochEinSoldat && s.platzFürPanzer && s.nurNochLostPanzer && d.tank_lost.length > 0; if (s.soldat) { e.push({ ...d.soldier.pop(), x: x, y: y }); s.soldatenInFolge = s.soldatenInFolge + 1; debug = false; } else if (s.panzer) { e.push({ ...d.tank.pop(), x: x, y: y }); s.soldatenInFolge = 0; x = x + 4; debug = false; } else if (s.lostPanzer) { e.push({ ...d.tank_lost.pop(), x: x, y: y }); s.letzterPanzerWarLost = true; s.soldatenInFolge = 0; x = x + 4; debug = false; } else if (s.lostSoldat) { e.push({ ...d.soldier_lost.pop(), x: x, y: y }); s.soldatenInFolge = s.soldatenInFolge + 1; debug = false; } else { Object.keys(d).every((key) => { if (d[key].length > 0) { e.push({ ...d[key].pop(), x: x, y: y }); return false; } debug = false; }); } } } console.log(d); return e; }30:T1c0d,fahrzeug = ` `31:T1d22,fahrzeugSt = ` `32:T921,soldat = ` `33:T9c7,soldatSt = ` `34:[] 2d:{"title":"4 GTD Strikethrough Map","cells":[{"id":0,"value":"# 4 GTD Strikethrough Map","pinned":false,"hidden":false,"mode":"md"},{"id":844,"value":"is_mobile = false","pinned":true,"hidden":false,"mode":"ojs"},{"id":602,"value":"zoomFac = is_mobile ? 0.65 : 0.9","pinned":true,"hidden":false,"mode":"ojs"},{"id":6,"value":"height = is_mobile ? 1400 : 1200","pinned":true,"hidden":false,"mode":"ojs"},{"id":33,"value":"width = is_mobile ? 347 : 627","pinned":true,"hidden":false,"mode":"ojs"},{"id":598,"value":"xFac = 10 * zoomFac","pinned":true,"hidden":false,"mode":"ojs"},{"id":600,"value":"yFac = 20 * zoomFac","pinned":true,"hidden":false,"mode":"ojs"},{"id":675,"value":"textfields_mw = [\n [106, 400, 260, 85],\n [0, 1023, 350, 87],\n [45, 593, 261, 195],\n [0, 209, 260, 57],\n [0, 0, 350, 80],\n [208, 877, 44, 27]\n]","pinned":true,"hidden":false,"mode":"ojs"},{"id":754,"value":"textfields_cw = [\n [330, 319, 300, 58],\n [135, 476, 367, 273],\n [0, 982, 300, 96],\n [0, 150, 300, 58],\n [0, 0, 627, 34],\n [316, 856, 58, 33]\n]","pinned":true,"hidden":false,"mode":"ojs"},{"id":731,"value":"padding = 10","pinned":true,"hidden":false,"mode":"ojs"},{"id":4,"value":"","pinned":false,"hidden":false,"mode":"html"},{"id":401,"value":"draw()","pinned":true,"hidden":false,"mode":"ojs"},{"id":502,"value":"$2f","pinned":true,"hidden":false,"mode":"ojs"},{"id":121,"value":"draw = function () {\n let canvas = d3.select(\"#canvas\");\n let _d = plotData2();\n canvas.selectAll(\".figure\").remove();\n\n canvas\n .selectAll(\".figure\")\n .data(_d)\n .enter()\n .append(\"g\")\n .attr(\"class\", \"figure\")\n .attr(\n \"transform\",\n (d) =>\n `translate(${d.x * xFac + (Math.random() - 0.5) * 3 * zoomFac}, ${\n d.y * yFac\n }) scale(${zoomFac})`\n )\n .html((d) => {\n switch (d.type) {\n case \"soldier\":\n return soldat;\n case \"soldier_lost\":\n return soldatSt;\n case \"tank\":\n return fahrzeug;\n case \"tank_lost\":\n return fahrzeugSt;\n }\n });\n\n canvas.selectAll(\"path\").attr(\"fill\", (d) =>\n chroma(\"#628658\")\n .darken(Math.random() * 1.5)\n .brighten(Math.random() * 1.5)\n .hex()\n );\n\n //canvas.selectAll(\".figure svg\").attr(\"style\", `transform: scale(${zoomFac})`);\n return _d;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":550,"value":"plotData2()","pinned":true,"hidden":false,"mode":"ojs"},{"id":313,"value":"// Generates an object for each soldier and tank\ndata = function () {\n let _d = { soldier: 1676, soldier_lost: 774, tank: 31, tank_lost: 129 };\n for (let [k, v] of Object.entries(_d)) {\n _d[k] = Array.from(Array(v)).map((d) => ({\n type: k\n }));\n }\n return _d;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":850,"value":"textfields = is_mobile ? textfields_mw : textfields_cw","pinned":true,"hidden":false,"mode":"ojs"},{"id":749,"value":"data()","pinned":true,"hidden":false,"mode":"ojs"},{"id":301,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":77,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":180,"value":"$32","pinned":true,"hidden":false,"mode":"ojs"},{"id":293,"value":"$33","pinned":true,"hidden":false,"mode":"ojs"},{"id":167,"value":"chroma = require(\"chroma-js\")","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W34","stdlib":"1","titling":"auto"}