> For the complete documentation index, see [llms.txt](https://docs.apryse.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.apryse.com/web/annotation/export-inline-appearances.md).

# Exporting Inline Appearances for Annotations

Here is your guide explaining how to export inline appearances for annotations in viewer

Annotations inside a PDF document have a number of different properties that define how they are rendered. For example their fill and stroke color, opacity, stroke thickness, etc. Annotations can also define an appearance (AP key in the PDF spec). An appearance is basically a set of drawing instructions that should be used to render an annotation’s appearance and any properties (other than the position) should be ignored.

Note that appearances are drawn by default, but they are not always present and can sometimes be different than how we expect an annotation to appear based on the properties alone.

By default WebViewer will export an appearance as a reference to the object number in the PDF that the annotation exists in. Since it doesn't include the entire appearance data this means the XFDF string is much shorter. However this also means that if you try to import this XFDF into a different document then the appearance reference will no longer exist and the appearance will not be shown.

WebViewer provides an option to `exportAnnotations` called `generateInlineAppearances`. When this option is used then the entire appearance data will be included inline in the XFDF string. This means that if you import the string into another PDF file it will work just fine. However this also means that the XFDF string will be quite a bit longer.

## Programmatically exporting XFDF with inline appearances

The following code snippet can be used to export annotations with inline appearances.

{% tabs %}
{% tab title="JavaScript" %}
{% code lineNumbers="true" %}

```js
const xfdfString = await instance.Core.annotationManager.exportAnnotations({ generateInlineAppearances: true });
```

{% endcode %}
{% endtab %}
{% endtabs %}

As an example if you only wanted to export the XFDF for callout annotations and include the inline appearances you could do it like this.

{% tabs %}
{% tab title="JavaScript" %}
{% code lineNumbers="true" %}

```js
var annotList = await instance.Core.annotationManager.getAnnotationsList();
const result = annotList.filter((annot) => annot.IT === 'FreeTextCallout');

const xfdfString = await instance.Core.annotationManager.exportAnnotations({ annotationList: result,generateInlineAppearances: true });
```

{% endcode %}
{% endtab %}
{% endtabs %}

If you are using the full API with a `PDFDoc` object then inline appearances can be generated using the code below.

{% tabs %}
{% tab title="JavaScript" %}
{% code lineNumbers="true" %}

```js
const pdfDoc = await instance.Core.documentViewer.getDocument().getPDFDoc();
const fdfDoc = await pdfDoc.fdfExtract(1);
const exportOptions = await Core.PDFNet.FDFDoc.createXFDFExportOptions();
exportOptions.setWriteAnnotationAppearance(true);
const xfdfStr = await fdfDoc.saveAsXFDFAsStringWithOptions(exportOptions);
```

{% endcode %}
{% endtab %}
{% endtabs %}

After exporting the XFDF it can be imported back into WebViewer using any of the normal importing functions. For example you can use importAnnotations as shown below

{% tabs %}
{% tab title="JavaScript" %}
{% code lineNumbers="true" %}

```js
await instance.Core.annotationManager.importAnnotations(xfdfString);
```

{% endcode %}
{% endtab %}
{% endtabs %}

Note that custom appearances can't currently be exported inline. See guide for more information about [custom appearances](/web/annotation/custom-appearances.md).


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.apryse.com/web/annotation/export-inline-appearances.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
