Pictures (bitmap images) can be added to Tinderbox in one of two ways:
- Image adornments (Map view only).
- Embedded in notes. In map view these images can be seen if body text preview is enabled.
Embedding pictures in notes
To add an image to a note, select a supported image format file in Finder and drag it into a Map view (but not other major views), or copy/paste from Finder. A new adornment note will be created with the image embedded in the $Text of the note. The note is otherwise a normal note and can be moved around, renamed and have additional text added to $Text without affecting the image.
Once imported in this fashion, the image can then be selected/copied from the new note and pasted into other note(s). To create a note with multiple images, import each image as a separate note and copy/cut paste the data as necessary.
Images embedded in note $Text cannot be cropped, scaled or otherwise resized (thus unlike image adornments). Select the desired image size before adding the image file to Tinderbox.
If an image pasted into the text is wider than available space, it will automatically be scaled.
Export
Notes with images in $Text will export those images during HTML Export (but not text export)
Embedded image size control
The maximum width of the stored image based on an image added to $Text, is controlled by $ImageSizeLimit. If the added image width, in pixels, is greater than $ImageMaxSize (default 1600 px) the embedded image created is scaled to the maximum allowed size; the height is scaled, if needed, in proportion the change in width. Image added below the maximum are added at their actual size.
Images and document size
If the TBX is primarily intended for export, like this document, it may make more sense to store the images outside the TBX and link the exported pages to the external assets. Given that embedded images do not export )at least not in v5.x) then it is possible for a note to have both an embedded image for viewing within Tinderbox and alongside it export code that links to an externally stored coy of the image for use in HTML.
Tinderbox compresses images; this substantially decreases the size of Tinderbox files with embedded images. Tinderbox currently uses JPEG compression, and compresses fairly aggressively; this significantly diminishes the size and loading time of Tinderbox files at the cost of some image degradation. Images are stored in the TBX file's XML using Base64 encoding.
See also—notes linking to here: