Single-line Text Entity (TextEnt)

About 2 min

Single-line Text Entity (TextEnt)

TextEnt represents a single-line text entity in CAD, used to add simple text annotations.

Online Examples

Example	Description	Link
Single-line Text	TextEnt basics and property examples	Online Demo{target="_blank"}
Text Styles	Setting various text style properties	Online Demo{target="_blank"}
Font Settings	TrueType font and SHX font examples	Online Demo{target="_blank"}

Overview

Single-line text is the most basic text element, suitable for adding short labels, dimension values, etc. Each TextEnt contains only one line of text.

Constructor

import { TextEnt, TextAlignmentEnum } from 'vjcad';

// Method 1: Set properties individually (recommended)
const text1 = new TextEnt();
text1.insertionPoint = [100, 100];  // Supports array format
text1.text = "WebCAD";
text1.height = 10;
text1.setDefaults();

// Method 2: Constructor parameters
const text2 = new TextEnt([100, 100], "Hello", 10, 0, TextAlignmentEnum.Left);
text2.setDefaults();

Properties

Property	Type	Description
`insertionPoint`	Point2D	Text insertion point (supports `[x, y]` array format)
`position`	Point2D	Text position (alias for `insertionPoint`)
`text`	string	Text content (alias for `textString`)
`textString`	string	Text content
`height`	number	Text height
`rotation`	number	Rotation angle (radians)
`textAlignment`	TextAlignmentEnum	Alignment mode
`font`	string	Font name
`styleName`	string	Text style name
`textStyle`	TextStyle	Text style object (read-only, automatically obtained after setting styleName)
`widthFactor`	number	Width factor (read-only, obtained from textStyle, default 1)
`obliqueAngle`	number	Oblique angle (read-only, obtained from textStyle, default 0)

Alignment Modes (TextAlignmentEnum)

Enum Value	Value	Description
`TextAlignmentEnum.Left`	1	Bottom-left alignment (baseline)
`TextAlignmentEnum.Center`	2	Bottom-center alignment (baseline)
`TextAlignmentEnum.Right`	3	Bottom-right alignment (baseline)
`TextAlignmentEnum.MidLeft`	4	Middle-left alignment
`TextAlignmentEnum.MidCenter`	5	Center alignment
`TextAlignmentEnum.MidRight`	6	Middle-right alignment
`TextAlignmentEnum.TopLeft`	7	Top-left alignment
`TextAlignmentEnum.TopCenter`	8	Top-center alignment
`TextAlignmentEnum.TopRight`	9	Top-right alignment

Examples

Using Fonts

import { Engine, TextEnt } from 'vjcad';

// Method 1: Use font name directly as styleName (recommended)
// MainView automatically creates a TextStyle with the same name for configured fonts
const text1 = new TextEnt();
text1.insertionPoint = [0, 100];
text1.text = "使用楷体字体";
text1.height = 10;
text1.styleName = "simkai";  // Use font name directly
text1.setDefaults();

// Using SHX font
const text2 = new TextEnt();
text2.insertionPoint = [0, 80];
text2.text = "SHX Font Text";
text2.height = 10;
text2.styleName = "_default";  // Use font name directly
text2.setDefaults();

Engine.addEntities([text1, text2]);

Tips

Fonts need to be configured during MainView initialization. See Text Entities - Font Configuration for details.

Creating Basic Text

import { Engine, TextEnt } from 'vjcad';

const text = new TextEnt();
text.insertionPoint = [0, 100];  // Supports array format
text.text = "基础单行文字";
text.height = 10;
text.setDefaults();

Engine.addEntities(text);

Creating Rotated Text

import { Engine, TextEnt } from 'vjcad';

const text = new TextEnt();
text.insertionPoint = [100, 100];
text.text = "旋转文字";
text.height = 8;
text.rotation = Math.PI / 4;  // 45°
text.setDefaults();

Engine.addEntities(text);

Different Alignment Modes

import { Engine, TextEnt, TextAlignmentEnum } from 'vjcad';

const alignments = [
    { align: TextAlignmentEnum.Left, name: "Left(1)", y: 50 },
    { align: TextAlignmentEnum.Center, name: "Center(2)", y: 40 },
    { align: TextAlignmentEnum.Right, name: "Right(3)", y: 30 },
    { align: TextAlignmentEnum.MidLeft, name: "MidLeft(4)", y: 20 },
    { align: TextAlignmentEnum.MidCenter, name: "MidCenter(5)", y: 10 },
    { align: TextAlignmentEnum.MidRight, name: "MidRight(6)", y: 0 },
];

alignments.forEach(({ align, name, y }) => {
    const text = new TextEnt();
    text.insertionPoint = [100, y];
    text.text = name;
    text.height = 6;
    text.textAlignment = align;
    text.setDefaults();
    Engine.addEntities(text);
});

Setting Color

import { Engine, TextEnt } from 'vjcad';

const text = new TextEnt();
text.insertionPoint = [0, 0];
text.text = "颜色文字";
text.height = 8;
text.setDefaults();
text.color = 1;  // Color must be set after setDefaults()

Engine.addEntities(text);

Drawing Dimension Annotations

import { Engine, TextEnt, LineEnt } from 'vjcad';

function drawDimensionText(p1: [number, number], p2: [number, number], offset: number = 10) {
  // Calculate length
  const dx = p2[0] - p1[0];
  const dy = p2[1] - p1[1];
  const length = Math.sqrt(dx * dx + dy * dy);
  
  // Calculate angle
  const angle = Math.atan2(dy, dx);
  
  // Calculate midpoint
  const midX = (p1[0] + p2[0]) / 2;
  const midY = (p1[1] + p2[1]) / 2;
  
  // Create dimension line
  const line = new LineEnt(p1, p2);
  line.setDefaults();
  
  // Create dimension text
  const text = new TextEnt();
  text.insertionPoint = [
    midX - offset * Math.sin(angle),
    midY + offset * Math.cos(angle)
  ];
  text.text = length.toFixed(2);
  text.height = 5;
  text.rotation = angle;
  text.setDefaults();
  
  Engine.addEntities([line, text]);
}

drawDimensionText([0, 0], [100, 50]);