文件比较

文件比较的流程类似于基础看图的流程, 大致流程都是:

  1. 获取并设置图纸信息
  2. 获取并设置字体
  3. 获取并设置外部参照和图片
  4. 获取并设置 lmf 显示数据

但是在加载图纸信息加载 lmf 显示数据这两个步骤获取数据和设置数据有不同

获取图纸信息 设置图纸信息 下载 lmf 显示数据 设置 lmf 显示数据
基础看图 req.transfer() ZwCloud2D.ZwDataManager.ZwSetDwgInfo() req.getDisplayData() ZwCloud2D.ZwDataManager.ZwSetDwgData()
图纸对比看图 req.transferFcmp() ZwCloud2D.ZwDataManager.ZwSetFcmpDwgInfo() req.getFcmpDisplayData() ZwCloud2D.ZwDataManager.ZwSetFcmpDwgData()

# 1. 以文件比较的状态显示图纸

ZwCloud2D.ZwDataProcessor.ZwFcmpLoad = async () => {
  //设置基准图纸和参照图纸的文件path
  let sourcePath = "xxx";
  let compareFilePath = "xxx";

  let req = new Request();

  // 文件比较前需要先获取基准图纸的xref数据
  await req.getXrefRelation(sourcePath);

  // 获取并设置文件对比的数据
  let fcmpInfo = await req.transferFcmp({ sourcePath, compareFilePath });
  let res = await ZwCloud2D.ZwDataManager.ZwSetFcmpDwgInfo(fcmpInfo);

  // 下载并设置缺失字体, 详见代码演示3
  await ZwCloud2D.ZwDataProcessor.ZwProcessFontData(res.missingFonts);

  // 下载并设置外部参照, 详见代码演示2
  ZwCloud2D.ZwDataProcessor.ZwProcessXrefData(
    sourcePath,
    fcmpInfo.baseFileName
  );

  //下载并设置lmf显示数据
  let fcmpLmfArrayBuffer = await req.getFcmpDisplayData(
    compareFilePath,
    sourcePath
  );
  ZwCloud2D.ZwDataManager.ZwSetFcmpDwgData(
    res.layout.handleId,
    fcmpLmfArrayBuffer,
    res.timestamp || new Date().getTime()
  );
};

# 2. 用户的操作启动了文件比较(输入 fcmp 命令或点击图纸对比按钮)

//用户输入fcmp命令或点击图纸对比按钮
ZwCloud2D.ZwMessageCallback.ZwEvtFileCompare = async (data) => {
  if (data.state === "enterFcmp") {
    //设置基准图纸和参照图纸的文件path
    let sourcePath = "xxx";
    let compareFilePath = "xxx";

    let req = new Request();

    // 文件比较前需要先获取基准图纸的xref数据
    await req.getXrefRelation(sourcePath);

    // 获取并设置文件对比的数据
    let fcmpInfo = await req.transferFcmp({ sourcePath, compareFilePath });
    let res = await ZwCloud2D.ZwDataManager.ZwSetFcmpDwgInfo(fcmpInfo);

    // 下载并设置缺失字体, 详见代码演示3
    await ZwCloud2D.ZwDataProcessor.ZwProcessFontData(res.missingFonts);

    // 下载并设置外部参照, 详见代码演示2
    ZwCloud2D.ZwDataProcessor.ZwProcessXrefData(
      sourcePath,
      fcmpInfo.baseFileName
    );

    //下载并设置lmf显示数据
    let fcmpLmfArrayBuffer = await req.getFcmpDisplayData(
      compareFilePath,
      sourcePath
    );
    ZwCloud2D.ZwDataManager.ZwSetFcmpDwgData(
      res.layout.handleId,
      fcmpLmfArrayBuffer,
      res.timestamp || new Date().getTime()
    );
  }
};
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <base href="/pages/" />
    <title>Html Demo</title>
  </head>

  <style>
    body {
      margin: 0;
      overflow: hidden;
    }
  </style>

  <script
    type="text/javascript"
    src="../assets/ZwCloud2DSDK/ZwCloud2D.js"
  ></script>

  <body id="wholeFrame">
    <div id="container" style="width: 100vw; height: 100vh"></div>

    <script type="module">
      // 初始化配置
      const initializeViewer = async () => {
        try {
          // 设置云服务连接配置
          window.ZwCloud2D.ZwDataProcessor.ZwSetConnectUrl(
            process.env.HTML_APP_ZW_URL
          );
          // 设置认证令牌
          window.ZwCloud2D.ZwDataProcessor.ZwSetToken(
            process.env.HTML_APP_ZW_TOKEN
          );
          // 初始化编辑器
          await window.ZwCloud2D.ZwEditor.ZwInit(
            document.getElementById("container")
          );
        } catch (error) {
          console.error("初始化失败:", error);
          // 可以添加错误处理逻辑
        }
      };

      initializeViewer().then(() => {
        window.ZwCloud2D.ZwDataProcessor.ZwSetFcmpDwg(
          "1846490571615449089",
          "1846492495668523009"
        );

        window.ZwCloud2D.ZwDataProcessor.ZwFcmpLoad();
      });
    </script>
  </body>
</html>