Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 33 additions & 4 deletions src/type/p5.Font.js
Original file line number Diff line number Diff line change
Expand Up @@ -234,15 +234,15 @@ export class Font {
* path and are more precise.
*
* `simplifyThreshold` removes collinear points if it's set to a number other
* than 0. The value represents the threshold angle to use when determining
* than 0. The value represents the threshold angle in radians to use when determining
* whether two edges are collinear.
*
* @param {String} str string of text.
* @param {Number} x x-coordinate of the text.
* @param {Number} y y-coordinate of the text.
* @param {Object} [options] Configuration:
* @param {Number} [options.sampleFactor=0.1] The ratio of the text's path length to the number of samples.
* @param {Number} [options.simplifyThreshold=0] A minmum angle between two segments. Segments with a shallower angle will be merged.
* @param {Number} [options.simplifyThreshold=0] A minmum angle in radian sbetween two segments. Segments with a shallower angle will be merged.
* @return {Array<Object>} array of point objects, each with `x`, `y`, and `alpha` (path angle) properties.
*
* @example
Expand Down Expand Up @@ -306,15 +306,15 @@ export class Font {
* path and are more precise.
*
* `simplifyThreshold` removes collinear points if it's set to a number other
* than 0. The value represents the threshold angle to use when determining
* than 0. The value represents the threshold angle in radians to use when determining
* whether two edges are collinear.
*
* @param {String} str string of text.
* @param {Number} x x-coordinate of the text.
* @param {Number} y y-coordinate of the text.
* @param {Object} [options] Configuration options:
* @param {Number} [options.sampleFactor=0.1] The ratio of the text's path length to the number of samples.
* @param {Number} [options.simplifyThreshold=0] A minmum angle between two segments. Segments with a shallower angle will be merged.
* @param {Number} [options.simplifyThreshold=0] A minmum angle in radians between two segments. Segments with a shallower angle will be merged.
* @return {Array<Array<Object>>} array of point objects, each with `x`, `y`, and `alpha` (path angle) properties.
*
* @example
Expand Down Expand Up @@ -1092,6 +1092,35 @@ function pathToPoints(cmds, options, font) {
return num;
};

const collinear = (a, b, c, thresholdAngle) => {
if (!thresholdAngle) {
return areaTriangle(a, b, c) === 0;
}

if (typeof collinear.tmpPoint1 === 'undefined') {
collinear.tmpPoint1 = [];
collinear.tmpPoint2 = [];
}

const ab = collinear.tmpPoint1,
bc = collinear.tmpPoint2;
ab.x = b.x - a.x;
ab.y = b.y - a.y;
bc.x = c.x - b.x;
bc.y = c.y - b.y;

const dot = ab.x * bc.x + ab.y * bc.y,
magA = Math.sqrt(ab.x * ab.x + ab.y * ab.y),
magB = Math.sqrt(bc.x * bc.x + bc.y * bc.y),
angle = Math.acos(dot / (magA * magB));

return angle < thresholdAngle;
};

const areaTriangle = (a, b, c) => {
return (b[0] - a[0]) * (c[1] - a[1]) - (c[0] - a[0]) * (b[1] - a[1]);
};

const path = createFromCommands(arrayCommandsToObjects(cmds));
let opts = parseOpts(options, {
sampleFactor: 0.1,
Expand Down
8 changes: 8 additions & 0 deletions test/unit/type/p5.Font.js
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,14 @@ suite('p5.Font', function () {
expect(pt.y).not.toBeNaN();
}
});

test('simplifies collinear points', async () => {
const font = await myp5.loadFont(fontFile);
myp5.textSize(50);
const pts = font.textToPoints('T', 0, 0);
const simplifiedPts = font.textToPoints('T', 0, 0, { simplifyThreshold: Math.PI * 0.01 });
expect(pts.length).toBeGreaterThan(simplifiedPts.length);
});
});
});

Expand Down
Loading