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:

beginArrow

beginArrow: string | number | ((linkView: dia.LinkView) => string | number)

A string or a callback which shows how start markers should be exported into Visio file. The Visio use markers from a fixed list of available markers, so it is not possible to export svg markers. This value should contain an index of an arrow type from the Visio.

endArrow

endArrow: string | number |((linkView: dia.LinkView) => string | number)

A string or a callback which shows how end markers should be exported into Visio file. The Visio use markers from a fixed list of available markers, so it is not possible to export svg markers. This value should contain an index of an arrow type from the Visio.

exportElement

exportElement: (elementView: dia.ElementView, visioPage: VisioPage, templates: VisioShapeTemplates) => Promise<VisioShape | JXON | null>

An async function run for each dia.Element present on the provided paper. The function is passing ElementView, VisioPage and templates factory and expects either an instance of VisioShape or a JXON 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;
}

If you want to utilize default export behavior and then change some things manually, you can use templates parameter to get default JXON and modify it.

exportElement: async(elementView, page, templates) => {
    // get default JXON for the elementView;
    const shapeJXON = templates.fromNodes(elementView);

    // update shapeJXON as you want

    return shapeJXON;
}

exportLink

exportLink: (linkView: dia.ElementView, visioPage: VisioPage, templates: VisioShapeTemplates) => Promise<VisioShape | JXON | null>

An async function run for each dia.Link present on the provided paper. The function is passing LinkView, VisioPage and templates factory and expects either an instance of VisioShape a JXON to be returned or a null if links is to be skipped in export process.

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

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

If you want to utilize default export behavior and then change some things manually, you can use templates parameter to get default JXON and modify it.

exportLink: async(linkView, page, templates) => {
    // get default JXON for the elementView;
    const connectionJXON = templates.fromConnection(linkView);

    // update connectionJXON as you want

    return shapeJXON;
}

useRecalcDocument

useRecalcDocument: boolean

Should the exported Visio file use useRecalcDocument special property to recalculate functions on file opening. If you are using default export you should set this to false, because it interferes with exporting link styling. The default is true.

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>;
}