31:T129b,Node = html`

`32:[{"id":"54ddfa68dca56fb8c3467d982a9f2139b19c42273e22ec6844344f0b976d44605c6eab2ddb5ee512512b28cba8b87aba6c7656b487225b2f4f47d73ad87a96e0","href":"https://static.observableusercontent.com/files/54ddfa68dca56fb8c3467d982a9f2139b19c42273e22ec6844344f0b976d44605c6eab2ddb5ee512512b28cba8b87aba6c7656b487225b2f4f47d73ad87a96e0","name":"IMG_1407 2.jpg","type":"image/jpeg","lastModified":1607766337180.3,"size":2542969}] 2f:{"title":"SVG extreme values","cells":[{"id":0,"value":"md`# SVG extreme values`","pinned":false,"hidden":false,"mode":"ojs"},{"id":89,"value":"md`Sometimes we need to use extreme number values in our SVG shapes`","pinned":false,"hidden":false,"mode":"ojs"},{"id":118,"value":"md`Turns out SVG is having hard time, with big float numbers like \\`100000000000000000000.8738217873\\`). \n\nFor the workaround, we can limit external, out of bound coordinate to stay within bounds, which SVG can handle (\\`2^26\\` or \\`67'108'864\\`) \n\nThat way we can still move forward untill we reach another limit 2^78` ","pinned":false,"hidden":false,"mode":"ojs"},{"id":222,"value":"FileAttachment(\"IMG_1407 2.jpg\").image()","pinned":false,"hidden":false,"mode":"ojs"},{"id":290,"value":"sides = sidesCalc({c:{x:0,y:0},rectWidth:2**26})","pinned":false,"hidden":false,"mode":"ojs"},{"id":283,"value":"sidesCalc = ({c,rectWidth})=> ({\n left : [\n {x: c.x - rectWidth/2, y: c.y - rectWidth/2},\n {x: c.x - rectWidth/2, y: c.y + rectWidth/2},\n ],\n right :[\n {x: c.x + rectWidth/2, y: c.y - rectWidth/2},\n {x: c.x + rectWidth/2, y: c.y + rectWidth/2}\n ],\n top : [\n {x: c.x - rectWidth/2, y: c.y - rectWidth/2},\n {x: c.x + rectWidth/2, y: c.y - rectWidth/2}\n ],\n bottom : [\n {x: c.x - rectWidth/2, y: c.y + rectWidth/2},\n {x: c.x + rectWidth/2, y: c.y + rectWidth/2}\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":280,"value":"function intersect(a, b) {\n let da = {x: a[1].x - a[0].x, y: a[1].y - a[0].y }\n let db = {x: b[1].x - b[0].x, y: b[1].y - b[0].y }\n let s = (-da.y * (a[0].x - b[0].x) + da.x * (a[0].y - b[0].y)) / (-db.x * da.y + da.x * db.y);\n let t = ( db.x * (a[0].y - b[0].y) - db.y * (a[0].x - b[0].x)) / (-db.x * da.y + da.x * db.y);\n \n let hit = {x: 0, y: 0 }\n if (s >= 0 && s <= 1 && t >= 0 && t <= 1)\n {\n // Collision detected\n hit.x = a[0].x + (t * da.x);\n hit.y = a[0].y + (t * da.y);\n hit.t = t\n return hit\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":277,"value":"function hitter({o,c}) {\n let ray = [\n {x: o.x, y: o.y},\n {x: c.x, y: c.y} \n ]\n let hit\n if(hit = intersect(ray, sides.left)) { hit.side = \"left\"; return hit }\n if(hit = intersect(ray, sides.top)) { hit.side = \"top\"; return hit }\n if(hit = intersect(ray, sides.right)) { hit.side = \"right\"; return hit }\n if(hit = intersect(ray, sides.bottom)) { hit.side = \"bottom\"; return hit }\n return o;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":304,"value":"origin = ({ x: 100, y:2**num })","pinned":false,"hidden":false,"mode":"ojs"},{"id":96,"value":"import {slider} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":95,"value":"viewof num = slider({\n title:\"Powers of 2\",\n min:1,\n max:77,\n value:5,\n step:1,\n format: v => `2^${v} or ${(2**v).toExponential(1)} or ${2**v} `,\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":7,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}