如何在网页打开CAD,DWG文件，（在线CAD）在线CAD平台，H5前端显示CAD，网页CAD
简介：全新在线CAD平台，基于JavaScript,WebGL,C++,Node.js,Three.js技术，前台使用html5方式，在线处理二维、三维CAD图纸，用于图纸管理、交流、批注、信息提取、三维展示等场景，支持dwg,dxf,dwf等文件格式，后台使用高效C++程序开发，异步多线程，多进程架构。平台前后台都提供js语言开发接口，开发人员就只需要会js语言，就可以快速搭建自己的在线CAD绘
简介
MxDraw云图是成都梦想凯德科技推出的一款整套的在线CAD解决方案，它主要包括MxDraw开发包，MxCAD开发包，后端服务程序，图纸转换程序4个部分，其详细说明如下：
1.MxDraw：前端二维绘图开发包，详细参考文档：https://mxcadx.gitee.io/mxdraw_docs/
https://mxcadx.gitee.io/mxdraw_docs/2.MxCAD：是基于mxdraw开发的在线CAD开发包，详细参考文档：https://mxcadx.gitee.io/mxcad_docs/zh/https://mxcadx.gitee.io/mxcad_docs/zh/
3.图纸转换程序：用于将CAD图纸转换为我们特有的网页格式mxweb，详细参考文档： MxDraw帮助https://help.mxdraw.com/?pid=107
4.后端服务程序：详细参考梦想云图Node.JS服务：MxDraw帮助https://help.mxdraw.com/?pid=1155.支持国产操作系统：
支持平台：Windows系统、Linux系统、国产操作系统、iOS、安卓。
支持CPU架构：X86、ARM、龙芯。
支持浏览器：Chrome,Edge,Firefox, Safari, 360, QQ等浏览器。
建议使用最新版本的chrome浏览器或edge浏览器
入门开发指导
1.在网页中绘图，其详细操作请参考：快速入门 | mxdraw (gitee.io)https://mxcadx.gitee.io/mxdraw_docs/start/abstract.html
2.在网页中加载编辑CAD图纸，其详细操作请参考：快速入门 | mxcad (gitee.io)https://mxcadx.gitee.io/mxcad_docs/zh/1.%E5%BC%80%E5%A7%8B/2.%E5%BF%AB%E9%80%9F%E5%85%A5%E9%97%A8.html
主要功能
支持AutoCAD R14 到AutoCAD 2024的所有dwg图纸格式，未来也将支持新出现的AutoCAD文件格式。
三维支持：创建锥、柱、环等基本几何体, 对几何体进行布尔操作（相加、相减、相交运算)、倒角、斜切、镂空、偏移、扫视,、几何空间关系计算（法线、点积、叉积、投影、拟合等）、几何体分析（质心、体积、曲率等）、空间变换（平移、缩放、旋转）等功能。
二维支持：CAD图纸信息搜索提取、测距离、算面积、批注、捕捉、正交、曲线离散、偏移、打断、阵列、扩展数据读写、扩展记录读写、构造选择集、动画、自定义实体、组、超连接、Undo、Redo、字典、图层、标注样式、线型样式、文字样式、视口、布局、用户坐标系、系统变量、图纸比较、动态提示等。
主要实体有：直线、圆弧、Polyline、样条线、圆、椭圆、椭圆弧、IMAGE、点、块引用、外部块参照、射线、云线、文本、多行文本、对齐标注、旋转标注、半径标注、直径标注、角度标注、布局、视口、图层、线型、文字样式、命名字典、标注、自定义实体、代理实体、反应器等。
主要编辑有：移动、夹点拉伸、偏移、删除、复制、粘贴、旋转、缩放、镜向、离散、图案填充、实心填充、打碎、计算曲线长、面积、最近点、交点、导角、文字变线条等。
几何运算：面积、夹角、向量、矩阵、旋转、缩放、最近点、最近距离、垂足、参数、镜向、平移、交点、打断、延伸、最短路径、最长路径。
项目示例
重要提示：使用最新的chrome浏览器，或edge浏览器访问如下网址。
1、在线MxDraw： embedmxcadhttps://www.mxdraw3d.com/sample/vuebrowse/
2、在线MxCAD：在线CAD梦想画图https://demo.mxdraw3d.com:3000/mxcad/
在线CAD梦想画图https://demo2.mxdraw3d.com:3000/mxcad/
3、CAD与GIS结合演示：在线CAD梦想画图https://demo.mxdraw3d.com:3000/mxcad/?map=true&maptype=gdslwzjMxDraw云图GIShttps://www.mxdraw3d.com/sample/mx-vuemap/?cmd=Mx_CADGISDemo
功能演示
1.下载
2.解压
下载好 MxDraw 云图开发包的压缩包后使用解压软件解压（建议解压位置的路径使用英文，路径不要太长），由于开发包的内容很多，解压需要时间，请耐心等待！
解压开发包后，其文件目录如下所示：
3.运行演示
双击解压文件目录下的 Mx3dServer.exe 程序，其启动界面如下：
按照界面提示步骤操作，启动服务，在启动之前我们需要设置防火墙允许这两个服务程序能访问网络：Bin\Release\node.exe 和SRC\TsWeb\nodejs\node.exe，其设置如下：
注意：在启动前，可能需要关闭杀毒软件，它会误报和拦截我们服务器程序访问网络。
4.启动效果
1）服务程序
后端网站服务程序：该服务为用户提供后端支持，如果用户有自己网站服务，可以不启动该程序。
MxDrawNodeJS服务程序：该服务用于后端上传文件转换文件格式。
MxCAD文件上传保存服务程序：CAD图纸编辑后，保存到服务器的服务
2）效果演示
点击“启动浏览器查看演示”，展示前端在线预览CAD图纸
选择本地DWG文件
打开DWG文件，在线预览
点击“VueBrowse”，运行Browse模式
点击“启动MxCAD”，演示前端在线编辑CAD图纸
点击“CAD GIS”，运行MxGIS
点击“启动MxCAD3D”，运行Mx3D
图纸转换原理
云图的前端网页基于JS+Html5进行开发，不需要安装任何插件，其中CAD图形的渲染是基于WebGL使用Three.js三维开源平台。
后端使用Node.js、TS、C++语言开发，将DWG图纸格式解析成我们平台特有的mxweb文件格式，最后将文件传送给前端编辑，其编辑原理如下：
上述原理中涉及到了mxweb 格式的文件，该文件格式是针对DWG、DXF文件体积大、版本多、网页加载效率慢、空间内存大、容易加载失败等一系列问题而专门设计的网页CAD格式。mxweb与CAD文件可以通过云图开发包相互转换，相关步骤请参考下面的图纸转换。
图纸转换
CAD文件转成编辑格式mxweb
1. Windows系统
a. 调用云图开发包目录Bin\MxCAD\Release\mxcadassembly.exe 路径中的应用程序转换文件格式。
b. 调用命令mxcadassembly.exe目标CAD图纸文件或mxcadassembly.exe{"srcpath":" 转换的文件路径","outpath":"输出文件路径","outname":"输出文件名", "compression":0}，将目标CAD图纸文件转成mxweb格式，其中json传参调用命令中的“compression"为0表示不压缩, 不写该属性表示压缩。
2. Linux系统：
a. 将Mxdraw云图开发包目录 Bin\Linux\BinMxCAD 路径下的文件拷到 Linux系统上，执行如下命令，增加文件的执行权限。
sudo chmod -R 777 mxcadassembly
sudo chmod -R 777 ./mx/so/*
sudo cp -r -f ./mx/locale /usr/local/share/locale
b. 再调用命令./mxcadassembly目标CAD图纸文件或./mxcadassembly "{"srcpath":"转换的文件路径","outpath":"输出文件路径","outname":"输出文件名", "compression":0}"，将目标CAD图纸文件转成mxweb格式，其中json传参调用命令中的“compression"为0表示不压缩, 不写该属性表示压缩。
使用json传参调用如下：
./mxcadassembly "{'srcpath':'/home/mx/test.dwg','outpath':'/home/mx/Test','outname':'xxx'}"3.也可以直接调用我们梦想云图Node.JS服务转换，详见：MxDraw帮助中的A条说明。
4. JAVA调用：后台JAVA程序如何调用mxcadassembly.exe转换CAD文件格式：
a. Windows系统：
后台JAVA程序调用代码：https://demo.mxdraw3d.com:3562/linux_main_dwg_to_mxweb.7z
import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStream;
import java.io.InputStreamReader;
import java.io.OutputStream;
public class MyTest {
// 后面java程序，调用我们exe程序转换dwg文件格式.
public static String CallMxFileConvert(String sDwgFile) {
// 我们转所程序路径.
String command = "Bin/MxCAD/Release/mxcadassembly.exe";
Runtime rn = Runtime.getRuntime();
Process process = null;
// 转换参数。
String sJsonParam = "{\"srcpath\":\"" + sDwgFile + "\"}";
String[] sRetJson = new String[1];
try {
// 启动一个进程序，调用转换程序。
process = rn.exec(new String[] {
command, sJsonParam
});
final InputStream ins = process.getInputStream();
final InputStream errs = process.getErrorStream();
//确保子进程与主进程之间inputStream不阻塞
new Thread() {@
Override
public void run() {
BufferedReader inb = null;
String line = null;
try {
inb = new BufferedReader(new InputStreamReader(ins, "gbk"));
while ((line = inb.readLine()) != null) {
sRetJson[0] = line;
//System.out.println("executeMxExe - InputStream : " + line);
}
} catch (IOException e) {
e.printStackTrace();
} finally {
try {
if (null != inb)
inb.close();
if (null != ins) {
ins.close();
}
} catch (IOException e) {
e.printStackTrace();
}
}
}
}.start();
//确保子进程与主进程之间ErrorStream不阻塞
new Thread() {@
Override
public void run() {
BufferedReader errb = null;
String line = null;
try {
errb = new BufferedReader(new InputStreamReader(errs, "gbk"));
while ((line = errb.readLine()) != null) {
System.out.println("executeMxExe - ErrorStream : " + line);
}
} catch (IOException e) {
e.printStackTrace();
} finally {
try {
if (null != errb)
errb.close();
if (null != errs) {
errs.close();
}
} catch (IOException e) {
e.printStackTrace();
}
}
}
}.start();
int retCode = process.waitFor();
} catch (Exception e) {
// TODO: handle exception
e.printStackTrace();
} finally {
if (null != process) {
OutputStream out = process.getOutputStream();
if (null != out) {
try {
out.close();
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
process.destroy();
}
}
// 返回转换结果。
return sRetJson[0];
}
public static void main(String[] args) {
String sDwg = "e:/1.dwg";
String sRetJson = CallMxFileConvert(sDwg);
System.out.println(sRetJson);
}
};b. Linux系统：
后台JAVA程序调用代码： https://demo.mxdraw3d.com:3562/linux_main_dwg_to_mxweb.7z
import java.io.*;
import java.util.ArrayList;
import java.util.List;
import static jdk.nashorn.internal.runtime.regexp.joni.Config.log;
class Cad2MxwebConvert {
// 后面java程序，调用我们exe程序转换dwg文件格式.
public static String CallMxFileConvert(String sourceFile,String outPath,String outFile){
String mxcadassembly="/usr/local/mxcad";
Process process=null;
// 转换文件路径.
String command = "./mxcadassembly";
// 转换参数。
String path="{'srcpath':'"+sourceFile+"','outpath':'"+outPath+"','outname':'"+outFile+"'}";
System.out.println("########################path:"+path);
try {
ProcessBuilder pb=new ProcessBuilder();
pb.redirectErrorStream(true);
List<String> commands = new ArrayList<>();
commands.add(command);
commands.add(path);
pb.command(commands).directory(new File(mxcadassembly));
process = pb.start();
process.waitFor();
//阻塞当前线程，直到进程退出为止
InputStream inputStream = process.getInputStream();
//将字节流转成字符流
InputStreamReader inputStreamReader = new InputStreamReader(inputStream, "utf-8");
//字符缓冲区
char[] c = new char[1024];
int len = -1;
while ((len = inputStreamReader.read(c)) != -1) {
String s = new String(c, 0, len);
System.out.print(s);
}
inputStream.close();
inputStreamReader.close();
//阻塞当前线程，直到进程退出为止
BufferedReader bufrError = new BufferedReader(new InputStreamReader(process.getErrorStream(), "utf-8"));
while ((len = bufrError.read(c)) != -1) {
String s = new String(c, 0, len);
System.out.print(s);
}
bufrError.close();
int exitValue = process.exitValue();
if (exitValue == 0) {
System.out.println("进程正常结束");
} else {
System.out.println("进程异常结束");
}
} catch (Exception e) {
log.print("执行autocad转换出错");
} finally{
if(null !=process ){
OutputStream out = process.getOutputStream();
if(null != out){
try {
out.close();
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
process.destroy();
}
}
// 返回转换结果。
return "success";
}
};
public class Main {
public static void main(String[] args) {
Cad2MxwebConvert.CallMxFileConvert("/data/home/mxdraw/autocad/2.dwg","/data/home/mxdraw/autocad","2.mxweb");
}
}5.Node.js调用：
/* POST upload listing. */router.post('/', upload.single('file'), function (req, res, next) {
// 得到上传文件
var file = req.file;
// MxFileConvert.exe在服务器的路径
var pathConvertExt = '"' + __dirname + "/../../../Bin/MxCAD/Release/mxcadassembly.exe" + '"';
// 准备调用参数，json格式，srcpath是dwg在服务器上的路径.
var param: any = {};
param.srcpath = file;
var cmd = pathConvertExt + ' "' + JSON.stringify(param) + '"';
const exec = child_process.exec;
//调用MxFileConvert.exe进程，进行文件格式转换.
exec(cmd, (err, stdout, stderr) => {
if (err) {
res.json('{"code": 1, "message": "exec cmd failed"}');
}
else {
// 转换成功，通过命令输出json格式字符串.
res.json(stdout);
}
});
});通过程序转换后的文件默认与目标文件存放在同一目录下，比如：D:/test/test.dwg 转换后，生成 mxweb 文件目录为：D:/test/test.mxweb，将这些生成的文件放到Web服务的目录下，需能够直接在网页中下载这些文件，示例如下：https://demo.mxdraw3d.com:3000/mxcad/test3.mxwebhttps://demo.mxdraw3d.com:3000/mxcad/test3.mxweb
mxweb格式转CAD图纸
我们还可通过上述操作将mxweb格式的文件纸转换为dwg格式的文件，以调用mxcadassembly.exe程序执行如下命令为例，其中参数outname必须加上CAD图纸的后缀名，一般为.dwg。
mxcadassembly.exe {"srcpath":"D:\test.mxweb","outpath":"D:\","outname":"test.dwg"}
华为开发者空间，是为全球开发者打造的专属开发空间，汇聚了华为优质开发资源及工具，致力于让每一位开发者拥有一台云主机，基于华为根生态开发、创新。
更多推荐
21
0- 0
已为社区贡献5条内容
所有评论(0)