Aspose.Diagram for Java 是一個功能豐富的 Java API，用於以編程方式操作 Visio 圖表，而無需 Microsoft Visio。 API 支持使用流行的 Visio 格式，包括 VSD、VSDX、VDX、VSDM、VSSM 和 VSSX。最近，我們利用了 Aspose.Diagram for Java 的功能，使在 Node.js 應用程序中實現 MS Visio 自動化功能成為可能。這些功能使您可以在 Node.js 應用程序中創建、操作、轉換和處理 MS Visio 圖表。

Aspose.Diagram for Node.js via Java 提供了一套完整的功能來自動創建或操作 Visio 圖表。您可以通過幾行代碼非常輕鬆地創建、讀取、導出、打印和保護圖表。在本文中，我將介紹如何在 Node.js 應用程序中從頭開始創建 Visio 圖表。本文的其餘部分分為以下幾個部分。

Node.js Visio API - 安裝

使用以下命令在您的 Node.js 應用程序中安裝 Aspose.Diagram 包。

npm install aspose.diagram --save

在 Node.js 中創建 MS Visio 圖表

我將從頭開始創建一個空的 Visio 圖表 (VSDX)。以下是執行此操作的步驟。

以下代碼示例展示瞭如何在 Node.js 應用程序中創建 Visio 圖表 (VSDX)。

var aspose = aspose || {};
aspose.diagram = require("aspose.diagram");

var diagram = new aspose.diagram.Diagram();
diagram.save("output.vsdx", aspose.diagram.SaveFileFormat.VSDX);

在 Node.js 中將母版添加到 Visio 圖

Visio 模板包含用於在 Visio 圖表中添加/複製形狀的主形狀集合。您可以使用 VSS 模板文件將母版添加到 Visio 圖表。以下是使用 Aspose.Diagram 添加母版的步驟。

  • 使用 Diagram 類創建一個新的 Visio 圖表。
  • 使用模板文件的路徑和主人的名稱/ID 將主人添加到圖表中。
  • 使用大師的名字為圖表添加形狀。
  • 使用 Diagram.save() 方法保存圖表。

以下代碼示例演示如何在 Node.js 中向 Visio 圖表添加母版。

var aspose = aspose || {};
aspose.diagram = require("aspose.diagram");

var diagram = new aspose.diagram.Diagram();

// 將模板加載到流
templateFileName = "NetApp-FAS-series.vss";

// 使用模板文件路徑和主 ID 添加主
masterName = "FAS80xx rear empty";
diagram.addMaster(templateFileName, 2);

// 或者使用模板文件路徑和母版名稱添加母版
diagram.addMaster(templateFileName, masterName);

// 或者從源圖中添加母版到圖中
src = new aspose.diagram.Diagram(templateFileName);
diagram.addMaster(src, masterName);

// 添加具有定義的 PinX 和 PinY 的形狀。
diagram.addShape(2.0, 2.0, masterName, 0);
diagram.addShape(6.0, 6.0, masterName, 0);

// 添加具有定義的 PinX、PinY、寬度和高度的形狀。
diagram.addShape(7.0, 3.0, 1.5, 1.5, masterName, 0);

diagram.save("output.vsdx", aspose.diagram.SaveFileFormat.VSDX);

在 Node.js 中的 Visio 圖表中插入頁面

在創建形狀之前，您需要在 Visio 圖表中至少有一頁。 Visio 圖表中的每個頁面都有一個名稱和 ID，用於唯一標識該頁面。以下是在 Visio 圖表中添加頁面的步驟。

以下代碼示例展示瞭如何在 Node.js 中將頁面插入到 Visio 圖表中。

var aspose = aspose || {};
aspose.diagram = require("aspose.diagram");

var diagram = new aspose.diagram.Diagram();
// 它計算最大頁面 ID
 max = 0;
if (diagram.getPages().getCount() != 0)
    max = diagram.getPages().get(0).getID();

for ( i = 1; i < diagram.getPages().getCount(); i++)
{
    if (max < diagram.getPages().get(i).getID())
        max = diagram.getPages().get(i).getID();
}
        
// 初始化一個新的頁面對象
newPage = new aspose.diagram.Page();
// 設置名稱
newPage.setName("new page");
// 設置頁面 ID
newPage.setID(max + 1);

// 或者試試 Page 構造函數
// 頁面 newPage = new Page(MaxPageId + 1);

// 添加新的空白頁
diagram.getPages().add(newPage);
diagram.save("output.vsdx", aspose.diagram.SaveFileFormat.VSDX);

在 Node.js 中的 Visio 圖表中創建形狀

在圖表中創建頁面後，您可以向其中添加形狀。以下是在圖表中創建和插入形狀的步驟。

  • 創建一個 Diagram 類的對象。
  • 使用模板文件的路徑將 master 添加到圖中。
  • 使用 Diagram.addShape() 方法添加一個矩形。
  • 設置形狀的屬性，如 ID、文本、位置、填充顏色等。
  • 使用 Diagram.save() 方法保存圖表。

以下代碼示例演示如何在 Node.js 中向 Visio 圖表添加形狀。

var aspose = aspose || {};
aspose.diagram = require("aspose.diagram");

var diagram = new aspose.diagram.Diagram("output.vsdx");

// 按名稱獲取頁面
page = diagram.getPages()[.getPage("Page-2")];

// 使用模板文件路徑和主 ID 添加主
masterName = "Rectangle";
// 使用模板文件路徑和主控名稱添加主控
diagram.addMaster("Basic Shapes.vss", masterName);
            
// 頁面索引從0開始
PageIndex = 2;
width = 2, height = 2, pinX = 4.25, pinY = 4.5;
// 添加一個新的矩形形狀
rectangleId = diagram.addShape(pinX, pinY, width, height, masterName, PageIndex);
            
// 設置形狀屬性 
rectangle = page.getShapes().getShape(rectangleId);
rectangle.getXForm().getPinX().setValue(5);
rectangle.getXForm().getPinY().setValue(5);
rectangle.setType(TypeValue.SHAPE);
rectangle.getText().getValue().add(new Txt("Aspose Diagram"));
rectangle.setTextStyle(diagram.getStyleSheets().get(3));
rectangle.getLine().getLineColor().setValue("#ff0000");
rectangle.getLine().getLineWeight().setValue(0.03);
rectangle.getLine().getRounding().setValue(0.1);
rectangle.getFill().getFillBkgnd().setValue("#ff00ff");
rectangle.getFill().getFillForegnd().setValue("#ebf8df");

diagram.save("output.vsdx", aspose.diagram.SaveFileFormat.VSDX);

在 Node.js 中向 Visio 圖表添加文本形狀

Aspose.Diagram 還允許您向 Visio 圖表添加文本。在這種情況下，文本被添加為形狀。以下是將文本添加到 Visio 圖表的步驟。

  • 使用 Diagram 類創建一個新的 Visio 圖表。
  • 使用 Diagram.getPages().getPage(0).addText() 方法向圖表添加文本形狀。
  • 使用 Diagram.save() 方法保存圖表。

以下代碼示例展示瞭如何在 Node.js 中向 Visio 圖表添加文本形狀。

var aspose = aspose || {};
aspose.diagram = require("aspose.diagram");

var diagram = new aspose.diagram.Diagram();

// 設置參數
PinX = 1, PinY = 1, Width = 1, Height = 1;
text = "Test text";

// 向 Visio 頁面添加文本
diagram.getPages().getPage(0).addText(PinX, PinY, Width, Height, text);

diagram.save("output.vsdx", aspose.diagram.SaveFileFormat.VSDX);

Visio 圖表中的超鏈接可用於從一頁導航到另一頁，或將文件或網頁鏈接到繪圖。以下是將超鏈接添加到 Visio 圖表的步驟。

  • 創建一個新的 Visio 圖表。
  • 從圖表中選擇所需的頁面。
  • 從所選頁面中選擇所需的 Shape。
  • 使用 Hyperlink 類創建一個新的超鏈接並設置其屬性。
  • 使用 Shape.getHyperlinks().add() 方法將超鏈接添加到形狀。
  • 保存圖表。

以下代碼示例演示如何在 Node.js 中向 Visio 圖表添加超鏈接。

var aspose = aspose || {};
aspose.diagram = require("aspose.diagram");

var diagram = new aspose.diagram.Diagram();

page = diagram.getPages().getPage(0);
// 通過 ID 獲取形狀
shape = page.getShapes().getShape(2);

// 初始化超鏈接對象
hyperlink = new aspose.diagram.Hyperlink();
// 設置地址值
hyperlink.getAddress().setValue("http://www.google.com/");
// 設置子地址值
hyperlink.getSubAddress().setValue("Sub address here");
// 設置描述值
hyperlink.getDescription().setValue("Description here");
// 設置名稱
hyperlink.setName("MyHyperLink");

// 向形狀添加超鏈接
shape.getHyperlinks().add(hyperlink); 

diagram.save("output.vsdx", aspose.diagram.SaveFileFormat.VSDX);

結論

在本文中，您學習瞭如何在 Node.js 應用程序中從頭開始創建 Visio 圖表/繪圖。分步教程和代碼示例展示瞭如何使用幾行代碼在 Visio 圖表中添加母版、頁面、形狀、文本和超鏈接。您可以使用 文檔 探索有關適用於 Node.js 的 Visio API 的更多信息。

相關文章）