Document Editor · Editing Features

Images

Insert local images, compare inline and anchored placement, and inspect live image properties.

Live Image API

Insert and inspect document images

Choose how the image participates in the document, insert a local file, and then select any image in the editor to inspect its live properties.

Insert a local image

The file is read in the browser and sent directly to the editor as Base64 data.

Placement

Select an imageClick an image in the document to inspect and format it.

Images in this document

0 images

Reading the image collection...

What this demonstrates

Images are document objects, not HTML decoration

TX Text Control stores images as part of the Word-compatible document. Their placement, scale, text flow, accessibility metadata, and anchor position travel with the document when it is saved.

Image collection

TXTextControl.images

Insertion

ImageCollection.addInline / addAnchored

Image geometry

Image.getSize / getHorizontalScaling

Accessibility

FrameBase.getDescriptiveText / setDescriptiveText

How it works

A browser FileReader reads the selected file as a data URL. After removing the MIME prefix, the script passes the Base64 payload to either ImageCollection.addInline or ImageCollection.addAnchored. No separate upload endpoint is needed.

An inline image uses ImageInsertionMode.AsCharacter: it occupies a text position and follows the surrounding characters during editing. An anchored image is connected to a paragraph and uses ImageInsertionMode.DisplaceText, allowing document text to flow around the object.

The imageSelected and imageDeselected events keep the inspector synchronized with the editor. The selected Image inherits position, alignment, and descriptive-text members from FrameBase, while image-specific scaling is exposed by getHorizontalScaling, setHorizontalScaling, and their vertical counterparts.

ImageCollection.forEach enumerates the objects in the current text part. The collection overview is therefore generated from the loaded document instead of being hard-coded in the page.