HarmonyOS鸿蒙Next在线CAD中根据图框拆分DWG图纸和转成pdf打印

HarmonyOS鸿蒙Next在线CAD中根据图框拆分DWG图纸和转成pdf打印 前言

1. 有的CAD图纸中有许多的图框，用户需要将图纸按图框进行拆分成，或拆分完成再自动转成PDF进行打印，桌面端的CAD软件可以实现，但WebCAD中如何根据图框拆分DWG图纸并转成pdf打印呢？

2. 在线CAD测试：https://demo.mxdraw3d.com:3000/mxcad/

启动云图开发包Node服务

1. 要将图纸框选的部分打印成pdf或者保存为dwg文件，就需要使用到云图开发包中提供的Node服务，首先下载云图开发包: https://www.mxdraw.com/download.html

2. 启动梦想云图Node.JS服务: https://help.mxdraw.com/?pid=115

3. DWG图纸要在网页上显示需要安装转换程序，如果不熟悉原理，请查看快速入门中的《如何在自己系统中浏览dwg文件》章节，如下图所示：

4. 如果还有疑问可以查看：https://help.mxdraw.com/?pid=107中《mxdraw前端库预览图纸》章节，如下图：

前端选框选取

首先我们通过mxdraw库来预览图框，并且可以绘制一个选框来选择需要裁剪的内容，然后通过梦想云图NodeJS服务中对应的API接口进行处理，得到一个裁剪后的图纸或者pdf文件，前端代码如下:

<div style="height: 80vh; overflow: hidden;">
    <canvas id="mxcad"></canvas>
</div>
import { MrxDbgUiPrPoint, MxFun, MxDbRect } from "mxdraw"
MxFun.setIni({
  "EnableGripEidt": true,
})
MxFun.createMxObject({
  canvasId: "mxcad",  // canvas元素的id
  cadFile: "./buf/hhhh.dwg"  // 转换后的cad图纸文件 实际访问的是../demo/buf/$hhhh.dwg.mxb[index].wgh
})
// 绘制临时的选框, 然后通过回调函数 根据框选的CAD坐标 请求云图Node服务对于API完成本地的转PDF功能
drawSelectBox((pt1, pt2) => {
  const params = new URLSearchParams();
  params.append('cmd', 'cutcad');
  // file 参数对应的是要拆分的目标图纸文件, 这里D:/hhhh.dwg是指的后台服务 部署的主机D盘下的hhhh.dwg文件; out参数同理
  params.append('param', `file=D:/hhhh.dwg out=D:/hhhh_1.pdf lbx=${pt1.x} lby=${pt1.y} rtx=${pt2.x} rty=${pt2.y}`);
  fetch('http://localhost:1337/users/tools', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/x-www-form-urlencoded'
    },
    body: params.toString()
  }).then(async (res) => {
    const { code } = await res.json()
    if(code === 0) {
      alert("剪切成功")
    } else {
      alert("剪切失败")
    }
  }).catch((err) => {
    console.error(err)
  })
})

// 临时绘制一个选择框用于选择可以剪切的部分内容
async function drawSelectBox(callback: (pt1, pt2) => void) {
  const getPoint = new MrxDbgUiPrPoint()
  getPoint.go(() => {
    const pt1 = getPoint.value()
    // 需要将THREE.JS坐标转文档坐标.
    const cadPt1 = MxFun.docCoord2Cad(pt1.x, pt1.y, pt1.z)
    getPoint.setBasePt(pt1);
    const rect = new MxDbRect()
    rect.color = "#f00"
    rect.pt1 = pt1
    getPoint.setUserDraw((currentPoint, pWorldDraw) => {
      rect.pt2 = currentPoint
      pWorldDraw.drawCustomEntity(rect)
    })
    getPoint.go(async () => {
      const pt2 = getPoint.value()
      const cadPt2 = MxFun.docCoord2Cad(pt2.x, pt2.y, pt2.z)
      await callback(cadPt1, cadPt2)
    })
  })
}

调用MxWebDwg2Jpg.exe 程序剪切图纸

我们把测试的图纸放在D盘下，该文件在demo示例（zip下载地址）的public 目录下，要对CAD图纸剪切，并将剪切结果输出为 pdf和 dwg 格式，需要用到云图开发包中名称为MxWebDwg2Jpg.exe的程序，具体位置如下：

MxDrawCloudServer\Bin\Release\tool\MxWebDwg2Jpg.exe

要正确启动它需要对应的参数，首先需要一个cmd 这里我们的cmd就是 cutcad，其次还需要一些参数, 这些参数统一存放在一个txt文件中, 比如现在在D盘创建一个叫cutcad_param.txt的文件内容如下:

file=D:/hhhh.dwg out=D:/1.pdf lbx=60009.152793 lby=42457.503649 rtx=120145.567345 rty=85507.693766

这里out参数可以是.dwg的图纸文件, 那么就会剪切成图纸，如下图：

现在我们直接进入到MxDrawCloudServer\Bin\Release\tool目录, 运行如下命令:

MxWebDwg2Jpg.exe cutcad fileparam=D:/cutcad_param.txt

cutcad_param.txt可以是任意格式的文件, 执行后如果命令行返回的结果中code是0, 则说明执行成功, 否则失败.无论成功或者失败cutcad_param.txt都将被自动删除，如下图：

NodeJS后端实现拆分剪切pdf打印和dwg图纸

云图开发包中的NodeJs服务中对应的接口我们可以在MxDrawCloudServer\Bin\MxDrawServer\Windows\routes目录中查看对应源码，其他user.js文件中定义了tools接口，在上面前端代码中就是用这个接口进行的测试，而在tools接口中是调用了convert.js文件中的callCADTools函数，如下图：

根据上图callCADTools函数的代码, 我们可以看到，其实就是生成存放参数的文件,然后调用一下我们提供的MxWebDwg2Jpg.exe就可以了。

剪切后的实际效果图

剪切红色选框中的内容:

剪切部分转换成pdf和dwg文件打开显示内容:

需要注意的事项

• 部分图纸裁剪可能无效, 有问题的图纸可以反馈给我们
• 前端mxdraw库实现裁剪需要将坐标转成CAD文档坐标, 然后后端通过转换前的原图纸进行裁剪
• 云图开发包Node服务中的API接口只是简单的测试一下功能是可以正常使用的, 具体使用的时候需要根据实际需求进行修改
• 剪切的内容可以通过out参数 来存放在一个pdf格式或者dwg格式的文件中

Demo源码：

https://gitee.com/mxcadx/mxdraw-article/tree/master/%E6%A0%B9%E6%8D%AE%E5%9B%BE%E6%A1%86%E6%8B%86%E5%88%86%E5%9B%BE%E7%BA%B8%E8%BD%AC%E6%88%90pdf%E6%89%93%E5%8D%B0