Public
Edited
May 2, 2023
Importers
Insert cell
Insert cell
config = {
return {
fillColor: "#44DAB9",
fillAlpha: 0.3
};
}
Insert cell
function activateTool(toolName, p) {
var tool = p.tools.find((tool) => tool.name === toolName);
if (!tool) {
var tool = new p.Tool({ name: `${toolName}` });
}
tool.activate();
return tool;
}
Insert cell
gridPoint = function (canvasPoint, gridScale, p) {
return new p.Point(
(canvasPoint.x - p.view.center.x) / gridScale,
(canvasPoint.y - p.view.center.y) / gridScale
);
}
Insert cell
canvasPoint = function (gridPoint, gridScale, p) {
return new p.Point(
gridPoint.x * gridScale + p.view.center.x,
gridPoint.y * gridScale + p.view.center.y
);
}
Insert cell

function findItemNameInGroup(name, group) {
return group.children[name] ? group.children[name] : null;
}
Insert cell
function ensureGroupExistsInPaper(name, p) {
var children = p.project.activeLayer.children;
if (children[name]) return children[name];
else var group = new p.Group({ name: name });
return children[name];
}
Insert cell
/*
addChildInGroup("mainPath", Paper.Path, p, myGroup);
addChildInGroup("mainCircle", paper.Shape.Circle, p, myGroup);
*/
function addChildToGroup(childName, child, p, group) {
var children = group.children;
if (children[childName]) {
children[childName].remove();
}

child.name = childName;
group.addChild(child);

return children[childName];
}
Insert cell
function removeChildInGroup(childName, group) {
return group.children[childName].remove();
}
Insert cell
function hidGrp(p) {
return p.project.activeLayer.children["hiddenGroup"];
}
Insert cell
function hidKids(p) {
return p.project.activeLayer.children["hiddenGroup"].children;
}
Insert cell
function mainGrp(p) {
return p.project.activeLayer.children["mainGroup"];
}
Insert cell
function mainKids(p) {
return p.project.activeLayer.children["mainGroup"].children;
}
Insert cell
function tmpGrp(p) {
return p.project.activeLayer.children["tempGroup"];
}
Insert cell
function tmpKids(p) {
return p.project.activeLayer.children["tempGroup"].children;
}
Insert cell
function highlightPointList(list, p) {
list.forEach((point) => {
let tempPoint = new p.Path.Circle(point, 2);
tempPoint.fillColor = "white";
tempPoint.strokeColor = "green";
tempPoint.locked = true;
tmpGrp(p).addChild(tempPoint);
});
}
Insert cell
function highlightPoint(point, p) {
let tempPoint = new p.Path.Circle(point, 2);
tempPoint.fillColor = "white";
tempPoint.strokeColor = "green";
tempPoint.locked = true;
tmpGrp(p).addChild(tempPoint);
}
Insert cell
function getSelectedHidden(p) {
var selectedItems = __getSelected(p).map(
(item) => hidKids(p)[item.name.replace("main", "hidden")]
);
return selectedItems;
}
Insert cell
function createMainFromHidden(p, hiddenItem, gridScale) {
var newPosition = canvasPoint(hiddenItem.position, gridScale, p);
var newItem = hiddenItem.clone();
newItem.position = newPosition;
newItem.scale(gridScale, gridScale, newPosition);
newItem.name = hiddenItem.name.replace("hidden", "main");
newItem.strokeColor = "black";
newItem.fillColor = config.fillColor;
newItem.fillColor.alpha = config.fillAlpha;

newItem.strokeWidth = 2;
if (mainKids(p)[newItem.name]) {
mainKids(p)[newItem.name].remove();
}
mainGrp(p).addChild(newItem);
return newItem;
}
Insert cell
function pointOfPath(path, i) {
return path.segments[i].point;
}
Insert cell
/**
* Returns an array of selected items on the active layer of the project
* @param {*} ps - paper.js scope object
*/
function __getSelected(ps) {
// Get any main groups that contain a selected child; the group is considered selected.
let selectedGroups = ps.project.activeLayer.children.filter(
(c) => c.selected
);
// If nothing, return an empty array early.
if (selectedGroups.length === 0) {
return [];
}
// Gather all the children in the selected main groups in a single array.
let withinGroupSelectedItems = selectedGroups
.map((group) => group.children)
.flat();
// Return only the children in these groups which are actually selected.
return withinGroupSelectedItems.filter((item) => item.selected);
}
Insert cell
/**
* Clears the selection state of all items on the avtive layer of the project
* @param {*} ps - paper.js scope object
*/
function __clearSelects(ps) {
ps.project.activeLayer.children.forEach((c) => (c.selected = false));
}
Insert cell
selection = {
return {
content: [],
hid: function (p) {
return this.content.map(
(item) => hidKids(p)[item.name.replace("main", "hidden")]
);
},
clear: function (p) {
__clearSelects(p);
this.content = [];
},
push: function (item) {
if (!this.find(item)) this.content.push(item);
item.selected = true;
},
find: function (item) {
var a = this.content.filter((it) => it.name === item.name);
return a.length > 0 ? a[0] : null;
}
};
}
Insert cell

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.
Learn more