31:T4a8,chart = { const svg = d3.select(DOM.svg(width, height)); svg.append("polygon") .attr("class", "b") .attr("points", polygonB); let center = geometric.polygonCentroid(polygonB); let vertices = geometric.polygonRegular(5, 8000, center); const polygon = svg.append("polygon") .attr("class", "a") .attr("points", vertices) .call(drag); function drag(sel){ const dragGenerator = d3.drag() .on("start", start) .on("drag", dragging) .on("end", end); function start(){ sel.classed("active", 1); } function dragging(event){ const newCenter = [Math.round(event.x), Math.round(event.y)]; const angle = geometric.lineAngle([center, newCenter]); const distance = geometric.lineLength([center, newCenter]); vertices = geometric.polygonTranslate(vertices, angle, distance).map(vertex => { return vertex.map(point => Math.round(point)); }); polygon .attr("points", vertices); center = newCenter; } function end(){ sel.classed("active", 0); } sel.call(dragGenerator); } return svg.node(); }32:[] 2f:{"title":"geometric.polygonInPolygon","cells":[{"id":0,"value":"md`# geometric.polygonInPolygon\n\n[geometric.polygonInPolygon](https://github.com/HarryStevens/geometric#polygonInPolygon)(polygonA, polygonB) returns a boolean representing whether polygonA is contained by polygonB.\n\nDrag the blue polygon to see it in action.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":31,"value":"inside = geometric.polygonInPolygon(polygonA, polygonB);","pinned":false,"hidden":false,"mode":"ojs"},{"id":25,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":23,"value":"polygonA = {\n while (true){\n const polygon = d3.select(\"polygon.a\");\n if (polygon._groups[0][0]){\n const points = polygon.attr(\"points\").split(\",\").map(d => +d);\n let vertices = [];\n for (let i = 0, n = points.length; i < n; i++){\n if (i % 2 === 0){\n vertices.push([points[i], points[i + 1]]);\n }\n }\n yield vertices;\n }\n else {\n yield [[0, 0]];\n }\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":21,"value":"polygonB = {\n const center = [width / 2, height / 2].map(d => Math.round(d));\n return [\n [center[0] - 100, center[1]],\n [center[0] - 30, center[1]],\n [center[0] - 30, center[1] - 40],\n [center[0] - 10, center[1] - 97],\n [center[0] - 2, center[1] - 100],\n [center[0], center[1] - 130],\n [center[0] + 2, center[1] - 100],\n [center[0] + 10, center[1] - 97],\n [center[0] + 30, center[1] - 40],\n [center[0] + 30, center[1]],\n [center[0] + 100, center[1]],\n [center[0] + 100, center[1] + 120],\n [center[0] - 100, center[1] + 120]\n ];\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":19,"value":"md`## Style`","pinned":false,"hidden":false,"mode":"ojs"},{"id":17,"value":"html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":15,"value":"{\n d3.select(\"polygon.b\").classed(\"inside\", inside);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":13,"value":"md`## Dimensions`","pinned":false,"hidden":false,"mode":"ojs"},{"id":11,"value":"height = 300;","pinned":false,"hidden":false,"mode":"ojs"},{"id":29,"value":"radius = 8;","pinned":false,"hidden":false,"mode":"ojs"},{"id":9,"value":"md`## Imports`","pinned":false,"hidden":false,"mode":"ojs"},{"id":7,"value":"geometric = require(\"geometric@2\");","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}