31:[] 2f:{"title":"geometric.polygonRotate","cells":[{"id":0,"value":"md`# geometric.polygonRotate\n\n[geometric.polygonRotate](https://github.com/HarryStevens/geometric#polygonRotate)(polygon, angle[, origin]) returns the vertices resulting from rotating a polygon about an origin by an angle in degrees. If origin is not specified, the origin defaults to [0, 0].\n\nIn the example below, the origin is set to the center of the gray rectangle.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":43,"value":"viewof angle = slider({\n title: \"Rotation\",\n min: 0,\n max: 360,\n value: 0,\n step: 1\n});","pinned":false,"hidden":false,"mode":"ojs"},{"id":30,"value":"{\n const svg = d3.select(DOM.svg(width, height));\n \n svg.append(\"rect\")\n .attr(\"width\", width)\n .attr(\"height\", height);\n \n svg.append(\"polygon\")\n .attr(\"points\", rotated.join(\" \"));\n \n svg.append(\"polygon\")\n .style(\"opacity\", .1)\n .attr(\"points\", polygon.join(\" \"))\n \n svg.selectAll(\".rotated\")\n .data(rotated)\n .enter().append(\"circle\")\n .attr(\"class\", \"rotated\")\n .attr(\"r\", 2)\n .attr(\"transform\", d => `translate(${d})`);\n \n svg.selectAll(\".original\")\n .data(polygon)\n .enter().append(\"circle\")\n .style(\"opacity\", .1)\n .attr(\"class\", \"original\")\n .attr(\"r\", 2)\n .attr(\"transform\", d => `translate(${d})`);\n \n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":88,"value":"rotated = geometric.polygonRotate(polygon, angle, center);","pinned":true,"hidden":false,"mode":"ojs"},{"id":84,"value":"polygon = [\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];","pinned":false,"hidden":false,"mode":"ojs"},{"id":81,"value":"center = [width / 2, height / 2];","pinned":false,"hidden":false,"mode":"ojs"},{"id":27,"value":"md`## Style`","pinned":false,"hidden":false,"mode":"ojs"},{"id":24,"value":"html`\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":21,"value":"md`## Dimensions`","pinned":false,"hidden":false,"mode":"ojs"},{"id":18,"value":"height = 300;","pinned":false,"hidden":false,"mode":"ojs"},{"id":15,"value":"md`## Imports`","pinned":false,"hidden":false,"mode":"ojs"},{"id":10,"value":"geometric = require(\"geometric@2\");","pinned":false,"hidden":false,"mode":"ojs"},{"id":8,"value":"d3 = require(\"d3@5\");","pinned":false,"hidden":false,"mode":"ojs"},{"id":6,"value":"import { slider } from \"@jashkenas/inputs\";","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}