Tech Lead at Taktile.
Formerly Firebase, Google
distance = ({
prompt: "distance between two vector",
time: 1709506756661,
comment: "Function to calculate the distance between two vectors"
} &&
function distanceBetweenVectors(v1, v2) {
const dx = v2[0] - v1[0];
const dy = v2[1] - v1[1];
return Math.sqrt(dx * dx + dy * dy);
})
joint_arm = ({
body_length,
angle,
preceeding_angle,
following_angle,
lattice_length,
tube_diameter,
material_thickness,
taper = false,
taper_angle_1 = 45,
taper_angle_2 = 45,
debug = false
}) => {
const preceedingDir = vectorFromAngle(
preceeding_angle - angle,
tube_diameter
);
const preceedingOffset = rotateVector(
[0, tube_diameter * 0.5],
preceeding_angle - angle
);
const followingDir = vectorFromAngle(following_angle - angle, tube_diameter);
const followingOffset = rotateVector(
[0, -tube_diameter * 0.5],
following_angle - angle
);
const intercept1 = intercept(
preceedingOffset,
preceedingDir,
[0, tube_diameter * -0.5],
[1, 0]
);
const intercept2 = intercept(
followingOffset,
followingDir,
[0, tube_diameter * 0.5],
[1, 0]
);
const additional_length = body_length - lattice_length * 2;
const taperDir1 = vectorFromAngle(taper_angle_1);
const taperDir2 = vectorFromAngle(-taper_angle_2);
const taperCorner1 = intercept(
[lattice_length * 3 + additional_length, 0],
taperDir1,
[0, tube_diameter * -0.5 + material_thickness],
[1, 0]
);
const taperCorner2 = intercept(
[lattice_length * 3 + additional_length, 0],
taperDir2,
[0, tube_diameter * 0.5 - material_thickness],
[1, 0]
);
return svg`
<g transform="rotate(${angle})">
${
debug
? svg`<path stroke="green" fill="none" d="
M ${preceedingOffset[0]} ${preceedingOffset[1]}
L ${preceedingOffset[0] + preceedingDir[0]} ${
preceedingOffset[1] + preceedingDir[1]
}
M ${followingOffset[0]} ${followingOffset[1]}
L ${followingOffset[0] + followingDir[0]} ${
followingOffset[1] + followingDir[1]
}
"/>`
: undefined
}
<path stroke="red" fill="none" d="
M ${intercept1[0]} ${intercept1[1]}
${finger_clockwise_v1(
[intercept1[0], intercept1[1]],
[lattice_length * 2.5 + additional_length, tube_diameter * -0.5],
{
finger_depth: material_thickness,
end_anchor: true
}
)}
${
taper
? `
L ${lattice_length * 2.5 + additional_length} ${
tube_diameter * -0.5 + +material_thickness
}
L ${taperCorner1[0]} ${taperCorner1[1]}
L ${lattice_length * 3 + additional_length} 0
L ${taperCorner2[0]} ${taperCorner2[1]}
L ${lattice_length * 2.5 + additional_length} ${tube_diameter * 0.5}
`
: `L ${lattice_length * 2.5 + additional_length} ${
tube_diameter * 0.5 - material_thickness
}`
}
${finger_clockwise_v1(
[lattice_length * 2.5 + additional_length, tube_diameter * 0.5],
[intercept2[0], intercept2[1]],
{
finger_depth: material_thickness
}
)}
L ${intercept2[0]} ${intercept2[1]}
"/>
${drill_hole([lattice_length * 1 + additional_length + 8, 0])}
<!--${drill_pattern([lattice_length * 1 + additional_length, 0])}-->
${drill_pattern([lattice_length * 2 + additional_length, 0])}
</g>
`;
}
fingers_clockwise_v0_preview = {
const total_width = 40;
const total_height = 16;
return htl.svg`<div
style="
width: ${total_width}${units};
height: ${total_height}${units};
padding: 5px;
">
<svg class="lzr"
filename="nozzle_end"
width="${total_width}${units}"
height="${total_height}${units}"
viewBox="0 0 ${total_width} ${total_height}">
<path stroke="red" fill="white" d="
M 0 0
${finger_clockwise_v0([0, 0], [total_width, 0])}
M 0 0
${finger_clockwise_v0([0, 5], [total_width, 5], { invert: true })}
M 0 0
"/>
</div>`;
}
import { toc } from "@harrystevens/toc@129"
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
