2b:null 2c:["$","title",null,{"children":"Hex Grids with Cells | Andreas Kollegger | Observable"}] 31:T4a3,cells = (width, height, cellWidth, cellHeight, orientation, shapes) => { const flat = (orientation === 'flat'); const translateX = (x,y) => { return (flat) ? x : (y/(cellHeight*3/4)%2==0)? x : x+(cellWidth/2); }; const translateY = (x,y) => { return (flat) ? (x/(cellWidth*3/4)%2==0)? y : y+(cellHeight/2) : y; } return R.xprod(rangeStep(0, cellWidth*(flat ? 3/4 : 1), width), rangeStep(0, cellHeight*(flat ? 1 : 3/4), height)) .map( ([x,y], i) => { return svg` ${shapes.includes('hex') ? polygon(6,(flat ? Math.PI/2 : 0), (flat ? cellWidth : cellHeight)) : null} ${shapes.includes('box') ? rectangle(cellWidth, cellHeight) : null} ${shapes.includes('circle') ? circle(Math.min(cellWidth, cellHeight)) : null} ${shapes.includes('stadium') ? (stadium) : null} ${shapes.includes('iso') ? ((flat) ? iso(Math.min(cellWidth, cellHeight)) : null) : null} ${shapes.includes('dot') ? dot() : null} ` }) }32:[] 2f:{"id":"a63e607e4963861a","slug":null,"title":"Hex Grids with Cells","thumbnail":"34d8f9da70258057be2ad311bb7ca9db864a826318f8df25f8aa56499fd60e4c","access_level":"public","create_time":"$D2019-04-06T16:19:43.299Z","update_time":"$D2023-07-13T13:29:33.096Z","view_time":null,"first_public_time":"$D2023-07-13T13:11:15.548Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"487b818df4ba9896","login":"akollegger","name":"Andreas Kollegger","avatar_url":"https://avatars-next.observableusercontent.com/9e32eee9a0f7a06cc572c7b0ddf340db38e8d10ac150201d20e2cc2fa8c4394d","tier":"starter_2024"},"version":316,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"b3acdcb1e7dda3b1","login":"akollegger","name":"Andreas Kollegger","avatar_url":"https://avatars-next.observableusercontent.com/9e32eee9a0f7a06cc572c7b0ddf340db38e8d10ac150201d20e2cc2fa8c4394d","tier":null}],"members":[{"type":"individual","id":"b3acdcb1e7dda3b1","login":"akollegger","name":"Andreas Kollegger","avatar_url":"https://avatars-next.observableusercontent.com/9e32eee9a0f7a06cc572c7b0ddf340db38e8d10ac150201d20e2cc2fa8c4394d","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Hex Grids with Cells","cells":[{"id":0,"value":"md`# Hex Grids with Cells`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":46,"value":"hgrid(1200, 400, 60)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":170,"value":"vgrid(1200, 400, 60)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":266,"value":"viewof showCircles = checkbox('Circles',true)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":307,"value":"viewof showDots = checkbox('Dots',true)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":309,"value":"viewof showIso = checkbox('Iso',true)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":51,"value":"hgrid = (width, height, unitSize) => {\n const cellWidth = Math.sqrt(3) * unitSize;\n const cellHeight = 2 * unitSize;\n return svg``\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":168,"value":"vgrid = (width, height, unitSize) => {\n const cellWidth = 2 * unitSize;\n const cellHeight = Math.sqrt(3) * unitSize;\n return svg``\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"gridLines = (width, height, gridWidth, gridHeight) => { \n return svg``\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":30,"value":"vline = (step, height) => { return svg`` }","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":35,"value":"hline = (step, width) => { return svg`` }","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":103,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":141,"value":"stadium = () => {\n return svg`\n`\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":54,"value":"polygon = (points, spin, size) => {\n return svg``\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":191,"value":"rectangle = (width, height) => {\n return svg``\n}\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":209,"value":"cube = (size) => {\n return svg`\n \n \n \n`\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":203,"value":"iso = (size) => {\n return svg`\n`\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":183,"value":"circle = (size) => {\n return svg``\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":295,"value":"dot = (size) => {\n return svg``\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":55,"value":"polycorners = (points, spin, size) => {\n return R.range(0,points)\n .map(function(i) {\n var point = pointToCorner(i, points, spin, size);\n return point.x + \",\" + point.y;\n })\n .join(\" \");\n}\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":57,"value":"pointToCorner = (index, total, spin, size) => {\n var x = 0;\n var y = size;\n var angle = (((Math.PI * 2) / total) * index) + spin;\n var cos = Math.cos(angle);\n var sin = Math.sin(angle);\n var tx = x * cos - y * sin;\n var ty = x * sin + y * cos;\n return {\n x: tx,\n y: ty\n };\n}\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"isEven = n => n % 2 === 0","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":23,"value":"rangeStep = (start, step, stop) => R.map(\n n => start + step * n,\n R.range(0, (1 + (stop - start) / step) >>> 0)\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"import {R} from \"@itacirgabral/ramda\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":271,"value":"import {slider, menu, checkbox} from '@jheer/dom-utilities'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"1"}} 30:"$2f:body"