microsoft / maker.js

📐⚙ 2D vector line drawing and shape modeling for CNC and laser cutters.
http://maker.js.org
Apache License 2.0
1.76k stars 265 forks source link

How can I get the angle of the text created by model.Text()? #604

Open doox911-opensource opened 3 weeks ago

doox911-opensource commented 3 weeks ago
export function getTextModel(font, caption, font_size) {
  const model = new makerjs.models.Text(font, caption, font_size);

  model.layer = DrawLayerNames.Caption;

  const model_extents = makerjs.measure.modelExtents(model);

  return [model, model_extents];
}

const [caption, caption_extents] = getTextModel(font, `H: ${H}`, render_options.font_size);

  caption.origin = [
  // some origin
  ];

  makerjs.model.rotate(caption, /* some angle*/, caption.origin);

How can I find out how rotated the text is in another part of the program?

danmarshall commented 3 weeks ago

Hello, one thing to note is that your drawing is a plain object to which you can add your own properties:

caption.rememberMyRotation = 55;

Properties not used by Maker.js will remain untouched. Hope that helps.

doox911-opensource commented 3 weeks ago

Hello, one thing to note is that your drawing is a plain object to which you can add your own properties:

caption.rememberMyRotation = 55;

Properties not used by Maker.js will remain untouched. Hope that helps.

Ohhhh(

This decision was one of the first in my head) But I thought that maybe someone solved the problem in a different way.

My attempt to solve the problem without adding my own properties:

export function getCircumscribedRectangleAngle(model) {
  const { center, width, height, high } = makerjs.measure.modelExtents(model);

  if (width >= height) {
    const rightMiddle = [high[0], center[1]];

    return makerjs.angle.ofPointInDegrees(center, rightMiddle);
  } else {
    const topMiddle = [center[0], high[1]];

    return makerjs.angle.ofPointInDegrees(center, topMiddle);
  }
}

Has the development of the library stopped? A similar method would be very useful)

danmarshall commented 3 weeks ago

That's a cool solution! There are probably corner cases where, with a font that has ascenders and descenders, the bounding rectangle will not correlate with the font baseline. But if all characters are the same height, it should do the job :)

I have learned a lot (about computational geometry) while developing this library, and the JavaScript ecosystem has changed rapidly since I started. I'm always thinking of what I would do differently for the next version. So, I'm waiting for the right time to get leverage without as much work.

Back to your issue, another idea: perhaps you can add a baseline Line path to your Text model prior to rotating?

doox911-opensource commented 1 week ago
image image

I figured out why it doesn't work with slanted lines) Since the makers.measure.model Extends method returns the described rectangle, there are only 4 possible angles.