24:null 25:["$","title",null,{"children":"geometric.pointOnLine, geometric.pointWithLine | Harry Stevens | Observable"}] 2a:[] 28:{"id":"c463ce4b7cbcd048","slug":"geometric-pointonline-geometric-pointwithline","title":"geometric.pointOnLine, geometric.pointWithLine","thumbnail":"a1dd7c342287f3ad85cf414ad27c46b8477e71b3c165d853693a68dd4f3c5e31","access_level":"public","create_time":"$D2019-09-13T21:48:35.562Z","update_time":"$D2022-09-06T21:31:38.192Z","view_time":null,"first_public_time":"$D2019-09-15T20:15:40.237Z","fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"be420f6a83563b92","login":"harrystevens","name":"Harry Stevens","avatar_url":"https://avatars-next.observableusercontent.com/bc9bae4b7e30062b343ae978a13454e29cd3f2daf3a800d0024043686ddf094b","tier":"starter_2024"},"version":129,"publish_version":129,"role":null,"authored":false,"authors":[{"type":"individual","id":"61e2153e05789733","login":"harrystevens","name":"Harry Stevens","avatar_url":"https://avatars-next.observableusercontent.com/bc9bae4b7e30062b343ae978a13454e29cd3f2daf3a800d0024043686ddf094b","tier":null}],"members":[{"type":"individual","id":"61e2153e05789733","login":"harrystevens","name":"Harry Stevens","avatar_url":"https://avatars-next.observableusercontent.com/bc9bae4b7e30062b343ae978a13454e29cd3f2daf3a800d0024043686ddf094b","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":0,"collection":{"id":"cb194ebcc81c247f","slug":"geometric","title":"Geometric.js","owner":{"id":"be420f6a83563b92","login":"harrystevens","name":"Harry Stevens"}},"type":"notebook","body":{"title":"geometric.pointOnLine, geometric.pointWithLine","cells":[{"id":0,"value":"md`# geometric.pointOnLine, geometric.pointWithLine\n\nBoth [geometric.pointOnLine](https://github.com/HarryStevens/geometric#pointOnLine)(point, line) and [geometric.pointWithLine](https://github.com/HarryStevens/geometric#pointWithLine)(point, line) test whether a point is colinear with a line. However, pointOnLine will return true only if the point is also located on the line segment.\n\nDrag the slider below to see how the position of the circle affects the output of these functions: the circle will be blue if both are true, while it will be red if only pointWithLine is true.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":60,"value":"withLine = geometric.pointWithLine(point, line);","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":32,"value":"onLine = geometric.pointOnLine(point, line);","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"viewof x = Inputs.range([0, width], {\n label: \"x\",\n step: .5\n});","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":30,"value":"{\n const svg = d3.select(DOM.svg(width, height));\n \n svg.append(\"line\")\n .attr(\"x1\", line[0][0])\n .attr(\"y1\", line[0][1])\n .attr(\"x2\", line[1][0])\n .attr(\"y2\", line[1][1])\n .style(\"stroke\", \"black\");\n \n svg.append(\"circle\")\n .attr(\"cx\", point[0])\n .attr(\"cy\", point[1])\n .attr(\"r\", 5)\n .attr(\"class\", onLine ? \"on\" : withLine ? \"with\" : \"\");\n \n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":27,"value":"point = [x, center[1]];","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"line = {\n const a = [center[0] - 100, center[1]],\n b = [center[0] + 100, center[1]];\n return [a, b];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":100,"value":"md`## Style`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":103,"value":"html`\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":94,"value":"md`## Dimensions`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"center = [width / 2, height / 2];","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"height = 50","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":97,"value":"md`## Imports`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"geometric = require(\"geometric@2\");","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W2a","stdlib":"1","titling":"auto"}} 29:"$28:body"