Skip to content
Spirographs in a doc
Pack code
// basic Pack import
import * as coda from "@codahq/packs-sdk";
export const pack = coda.newPack();
pack.addFormula({
name: "DrawSpirograph",
description: "Draw a dynamic spirograph.",
resultType: coda.ValueType.String,
codaType: coda.ValueHintType.ImageReference,
parameters: [
coda.makeParameter({ //largeRadius
type: coda.ParameterType.Number,
name: "largeRadius",
description: "Radius of the large circle",
optional: false,
}),
coda.makeParameter({ //smallRadius
type: coda.ParameterType.Number,
name: "smallRadius",
description: "Radius of the small circle.",
optional: false,
}),
coda.makeParameter({ //width of the canvas
type: coda.ParameterType.Number,
name: "width",
description: "Width of the canvas.",
optional: false,
}),
coda.makeParameter({ //height of the canvas
type: coda.ParameterType.Number,
name: "height",
description: "Height of the canvas.",
optional: false,
}),
coda.makeParameter({ //color1
type: coda.ParameterType.String,
name: "color1",
description: "enter a hex code color (with the #)",
optional: false,
}),
coda.makeParameter({ //color2
type: coda.ParameterType.String,
name: "color2",
description: "enter a hex code color (with the #)",
optional: false,
}),
],
execute: function ([largeRadius, smallRadius, width, height, color1, color2]) {
//create an array of objects with startX, startY, endX, endY
const coordinateArray = [];
const xStorage = [];
const yStorage = [];
let previousX = NaN;
let previousY = NaN;
//do the math for all angles
for (let i = 0; i <= 360; i++) {
let startX = width / 2;
let startY = width / 2;
//hypocycloid equation
let xcoord = (largeRadius - smallRadius) * Math.cos(i) + smallRadius * Math.cos((largeRadius / smallRadius - 1) * i);
let ycoord = (largeRadius - smallRadius) * Math.sin(i) - smallRadius * Math.sin((largeRadius / smallRadius - 1) * i);
if (i > 0) {
startX = previousX;
startY = previousY;
}
let endX = startX + xcoord;
let endY = startY + ycoord;
//change previousEnd values
previousX = endX;
previousY = endY;
//add a color for the line
let color = color1;
if (i > 90) {
color = color2;
}
coordinateArray.push({
x1: startX,
y1: startY,
x2: endX,
y2: endY,
color: color,
});
xStorage.push(startX, endX);
yStorage.push(startY, endY);
}
Want to print your doc?
This is not the way.
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.