2b:null 2c:["$","title",null,{"children":"Theo Jansen's linkage | sw1227 | Observable"}] 31:T40b,chart = { const svg = d3.create("svg") .attr("width", width) .attr("height", height) const g = svg.append("g") .attr("transform", `translate(${width/2}, ${height / 3})`) // handcrafted const scale = Math.min(width / 200, height / 200) // handcrafted const xScale = x => scale * x const yScale = y => - scale * y g.selectAll(".line") .data(links) .enter().append("line") .attr("stroke", "#ccc") .attr("stroke-width", 4) .attr("x1", d => xScale(d[0].x)).attr("y1", d => yScale(d[0].y)) .attr("x2", d => xScale(d[1].x)).attr("y2", d => yScale(d[1].y)) g.selectAll(".point") .data(points) .enter().append("circle") .attr("fill", "steelblue") .attr("cx", d => xScale(d.x)) .attr("cy", d => yScale(d.y)) .attr("r", 6) g.selectAll(".text") .data(points) .enter().append("text") .attr("x", d => xScale(d.x) + 5) .attr("y", d => yScale(d.y)) .attr("font-size", "12px") .attr("fill", "steelblue") .text(d => d.name) return svg.node() }32:[{"id":"6934e9ad615229076661727a852858201278413edf0d7c8e28dc66ca8b3763f3a9485ebfa217181c07be6d5be8b94a66fc6f067bea3e979d55e162de6924b979","href":"https://static.observableusercontent.com/files/6934e9ad615229076661727a852858201278413edf0d7c8e28dc66ca8b3763f3a9485ebfa217181c07be6d5be8b94a66fc6f067bea3e979d55e162de6924b979","name":"D.jpg","type":"image/jpeg","lastModified":1622366681003.666,"size":22403},{"id":"c004b5c9af34375a2f346d541ef3791a26d7a9222d36b78aed93a43f9aacc21f4a861b4505344c62530ba9b3a035d1a0757ee1c748ec71214055537d4030a8bb","href":"https://static.observableusercontent.com/files/c004b5c9af34375a2f346d541ef3791a26d7a9222d36b78aed93a43f9aacc21f4a861b4505344c62530ba9b3a035d1a0757ee1c748ec71214055537d4030a8bb","name":"F.jpg","type":"image/jpeg","lastModified":1622366773977.239,"size":23085},{"id":"047d17da001e2ea52d0150c6f65398373faee4e451b4e29fc90ca79272e78e3cbde357b9cc7afd7269539e4652211426c08cb81c241ab704d72abdb680f73eaf","href":"https://static.observableusercontent.com/files/047d17da001e2ea52d0150c6f65398373faee4e451b4e29fc90ca79272e78e3cbde357b9cc7afd7269539e4652211426c08cb81c241ab704d72abdb680f73eaf","name":"C.jpg","type":"image/jpeg","lastModified":1622366369662.954,"size":22624},{"id":"52f5548a373128675929f90efc32064230ec8a3aca75aab7d5bbb68815222c749f10ab6197b72d1af2130fa00604e0a2ad07e54ec69b4d349296261f1f809e9e","href":"https://static.observableusercontent.com/files/52f5548a373128675929f90efc32064230ec8a3aca75aab7d5bbb68815222c749f10ab6197b72d1af2130fa00604e0a2ad07e54ec69b4d349296261f1f809e9e","name":"G.jpg","type":"image/jpeg","lastModified":1622366805666.699,"size":22701},{"id":"b56a63936d31857296a5612a2a36d8423653d05d2401546180de956e64bf50441c1c442922e3436fcfe166fbb44540c6ade8ebc3c31f9bb5fbf5198334d42e3d","href":"https://static.observableusercontent.com/files/b56a63936d31857296a5612a2a36d8423653d05d2401546180de956e64bf50441c1c442922e3436fcfe166fbb44540c6ade8ebc3c31f9bb5fbf5198334d42e3d","name":"E.jpg","type":"image/jpeg","lastModified":1622366581364.846,"size":22367},{"id":"3037c012e03cbce5758cd97a062cdfac1ddefc6c98cb76b2524e9b6c18a1eafe875b02d2475f9aa2b4d44806d1c9106e39ae61835452721a743fb646148af5b5","href":"https://static.observableusercontent.com/files/3037c012e03cbce5758cd97a062cdfac1ddefc6c98cb76b2524e9b6c18a1eafe875b02d2475f9aa2b4d44806d1c9106e39ae61835452721a743fb646148af5b5","name":"スクリーンショット 2021-05-30 18.15.20.png","type":"image/png","lastModified":1622366186112.204,"size":38337}] 2f:{"id":"adff9e6c86f95b6f","slug":"theo-jansens-linkage","title":"Theo Jansen's linkage","thumbnail":"fe528b0b5f267b46776ecf3d5defe97a7bd2a0af06063217c2b380e81efa1338","access_level":"public","create_time":"$D2021-05-30T08:25:10.133Z","update_time":"$D2021-05-30T09:30:17.916Z","view_time":null,"first_public_time":"$D2021-05-30T09:30:55.325Z","fork":false,"stars":2,"starred":false,"owner":{"type":"team","id":"06475ae5027cde36","login":"sw1227","name":"sw1227","avatar_url":"https://avatars-next.observableusercontent.com/3e09ff2c49317e618eedc394f3b33dbb5c952acf0d9654683424e681e7857f8c","tier":"starter_2024"},"version":264,"publish_version":264,"role":null,"authored":false,"authors":[{"type":"individual","id":"4a648b0bd17e2c08","login":"sw1227","name":"sw1227","avatar_url":"https://avatars-next.observableusercontent.com/3e09ff2c49317e618eedc394f3b33dbb5c952acf0d9654683424e681e7857f8c","tier":null}],"members":[{"type":"individual","id":"4a648b0bd17e2c08","login":"sw1227","name":"sw1227","avatar_url":"https://avatars-next.observableusercontent.com/3e09ff2c49317e618eedc394f3b33dbb5c952acf0d9654683424e681e7857f8c","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"subscribed":null,"forks":2,"collection":{"id":"28a9534646610347","slug":"mechanism","title":"Mechanism","owner":{"id":"06475ae5027cde36","login":"sw1227","name":"sw1227"}},"type":"notebook","body":{"title":"Theo Jansen's linkage","cells":[{"id":0,"value":"# Theo Jansen's linkage\nIn this notebook, animation of Jansen's linkage is implemented utilizing the reacitvenesss of Observable notebook.\n\n> Jansen's linkage is a planar leg mechanism designed by the kinetic sculptor Theo Jansen to generate a smooth walking motion.\n> \n> [Jansen's linkage - Wikipedia](https://en.wikipedia.org/wiki/Jansen%27s_linkage)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":47,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"theta = {\n while (true) {\n yield new Promise(resolve => {\n setTimeout(() => resolve((Date.now()/400)%(2*Math.PI)), 50);\n });\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"height = 400","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":156,"value":"## 1. Mechanism description\n### 1.1. Link length","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":161,"value":"

$\"Strandbeest$
By MichaelFrey - Own work, CC BY-SA 3.0, Link

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":27,"value":"// Link length\nlen = ({\n a: 38,\n b: 41.5,\n c: 39.3,\n d: 40.1,\n e: 55.8,\n f: 39.4,\n g: 36.7,\n h: 65.7,\n i: 49,\n j: 50,\n k: 61.9,\n l: 7.8,\n m: 15\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":182,"value":"### 1.2. Points and link connections","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":175,"value":"FileAttachment(\"スクリーンショット 2021-05-30 18.15.20.png\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":39,"value":"points = [O, A, B, C, D, E, F, G]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":41,"value":"links = [\n [O, A],\n [A, C],\n [B, C],\n [B, E],\n [C, E],\n [A, D],\n [B, D],\n [D, F],\n [E, F],\n [D, G],\n [F, G]\n]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":188,"value":"## 2. Coordinates","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":45,"value":"O = ({\n x: 0,\n y: 0,\n name: \"O\"\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":35,"value":"// Just rotating around O\nA = ({\n x: len.m * Math.cos(theta),\n y: len.m * Math.sin(theta),\n name: \"A\"\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":52,"value":"// Fixed point\nB = ({\n x: -len.a,\n y: -len.l,\n name: \"B\"\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":198,"value":"For point C, you need to calculate...\n\n- length ${tex`AB`}\n- length ${tex`x_c, y_c`}\n- angle ${tex`\\theta_{ab}`}\n\nin the following diagram:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":194,"value":"FileAttachment(\"C.jpg\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":73,"value":"AB = Math.sqrt((len.a + A.x)**2 + (len.l + A.y)**2)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":80,"value":"thetaAB = Math.atan2(A.y - B.y, A.x - B.x)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":60,"value":"C = {\n const xc = (AB**2 + len.b**2 - len.j**2) / (2 * AB)\n const yc = Math.sqrt(len.b**2 - xc**2)\n return {\n x: B.x + xc * Math.cos(thetaAB) + yc * Math.cos(thetaAB + Math.PI / 2),\n y: B.y + xc * Math.sin(thetaAB) + yc * Math.sin(thetaAB + Math.PI / 2),\n name: \"C\"\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":218,"value":"For point E, you need...\n- length ${tex`x_c, y_c`}\n- angle ${tex`\\theta_{bc}`}","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":215,"value":"FileAttachment(\"E.jpg\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":64,"value":"E = {\n const xc = (len.b ** 2 + len.d**2 - len.e**2) / (2 * len.b)\n const yc = Math.sqrt(len.d**2 - xc**2)\n const thetaBC = Math.atan2(C.y - B.y, C.x - B.x)\n return {\n x: B.x + xc * Math.cos(thetaBC) + yc * Math.cos(thetaBC + Math.PI / 2),\n y: B.y + xc * Math.sin(thetaBC) + yc * Math.sin(thetaBC + Math.PI / 2),\n name: \"E\"\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":231,"value":"Point D:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":227,"value":"FileAttachment(\"D.jpg\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":71,"value":"D = {\n const xc = (AB**2 + len.c**2 - len.k**2) / (2 * AB)\n const yc = Math.sqrt(len.c**2 - xc**2)\n return {\n x: B.x + xc * Math.cos(thetaAB) + yc * Math.cos(thetaAB - Math.PI / 2),\n y: B.y + xc * Math.sin(thetaAB) + yc * Math.sin(thetaAB - Math.PI / 2),\n name: \"D\"\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":241,"value":"Point F:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":246,"value":"FileAttachment(\"F.jpg\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":86,"value":"F = {\n const DE = Math.sqrt((D.x - E.x)**2 + (D.y - E.y)**2)\n const xc = (DE**2 + len.g**2 - len.f**2) / (2 * DE)\n const yc = Math.sqrt(len.g**2 - xc**2)\n const thetaDE = Math.atan2(E.y - D.y, E.x - D.x)\n return {\n x: D.x + xc * Math.cos(thetaDE) + yc * Math.cos(thetaDE + Math.PI / 2),\n y: D.y + xc * Math.sin(thetaDE) + yc * Math.sin(thetaDE + Math.PI / 2),\n name: \"F\"\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":250,"value":"Point G:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":255,"value":"FileAttachment(\"G.jpg\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":91,"value":"G = {\n const xc = (len.g**2 + len.i**2 - len.h**2) / (2 * len.g)\n const yc = Math.sqrt(len.i**2 - xc**2)\n const thetaDF = Math.atan2(F.y - D.y, F.x - D.x)\n return {\n x: D.x + xc * Math.cos(thetaDF) + yc * Math.cos(thetaDF + Math.PI / 2),\n y: D.y + xc * Math.sin(thetaDF) + yc * Math.sin(thetaDF + Math.PI / 2),\n name: \"G\"\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"1","titling":"auto"}} 30:"$2f:body"