Skip to main content

VisioPage

VisioPage contains metadata describing a page in a document. Its API allows to load contents of the page, as well as update the page data with JointJS Paper when exporting a project to vsdx format.

Methods

fromPaper()

async visioPage.fromPaper(paper: dia.Paper, options?: VisioPage.FromPaperAttributes): Promise<void>;

page.fromPaper() method is used when exporting a JointJS project to a vsdx file format. Before the vsdx archive is built, its pages should be updated with new content. This new content is built using JointJS paper.

The below example updates visio archive with the contents of JointJS paper and uses default converter to create a VisioShape for each JointJS Cell, as well as update project configuration. Lastly, the updated archive is exported as a vsdx file.

const archive = await VisioArchive.fromURL('./project.vsdx');
const { document: vsdDocument } = archive;
const [page1] = vsdDocument.getPages();

await page1.fromPaper(paper);
const blob = await archive.toVSDX({ type: 'blob' });

util.downloadBlob(blob, 'project.vsdx');

The fromPaper(paper, [opt]) method takes JointJS paper, and an object opt with the following parameters:

exportElement

An async function run for each dia.Element present on the provided paper. The function is passed elementView and expects either an instance of VisioShape to be returned or a null if element is to be skipped in export process.

exportElement: async(elementView) => {
const { model, paper } = elementView;

let master;
// perform relevant logic to find chosen master shape
// ...

// create a raw shape based on a stencil Master
const vsdShape = await VisioShape.fromMaster(master, vsdDocument);

// perform vsdShape manipulations based on the given elementView
// ...

// return modified vsdShape
return vsdShape;
}

An async function run for each dia.Link present on the provided paper. The function is passed linkView and expects either an instance of VisioShape to be returned or a null if links is to be skipped in export process. Connect objects required by Visio are created under the hood. The VisioShape returned by this function is the visual representation of connection in Visio.

exportLink: async(linkView) => {
let master;
// perform relevant logic to find chosen master shape
// ...

return await VisioShape.fromMaster(master, vsdDocument);
}

getContent()

async visioPage.getContent(): Promise<VisioPageContent>;

Return a VisioPageContent instance containing page shapes.

Properties

There are several properties that can be accessed:

background

visioPage.background: boolean;

Return true if the page is marked as a background page. Background pages are oftentimes used to show repetitive content on many foreground pages.

backPage

visioPage.backPage: number;

If the page uses a background page, return its id.

height

visioPage.height: number;

Return page height in pixels.

id

visioPage.id: number;

Return a unique, integer page id.

name

visioPage.name: string;

Return page name as configured in Visio project.

nameU

visioPage.nameU: string;

Return page universal name as configured in Visio project.

width

visioPage.width: number;

Return page height in pixels.

Types

FromPaperAttributes

interface FromPaperAttributes {
exportElement?: (
elementView: dia.ElementView,
visioPage: VisioPage,
templates: VisioShapeTemplates
) => Promise<VisioShape | null>;
exportLink?: (
linkView: dia.LinkView,
visioPage: VisioPage,
templates: VisioShapeTemplates
) => Promise<VisioShape | null>;
}

VisioShapeTemplates

interface VisioShapeTemplates {
fromConnection(linkView: dia.LinkView): Promise<JXON>;
fromNodes(cellView: dia.CellView): Promise<JXON>;
}