网页加载CAD图纸的两个方案

temacon

梦想控件提供两种技术在网页中加载CAD图纸，一个是OCX技术方案，另一个是HTML5技术方案，它们各有优缺点，用户需根据实际情况进行选择，下边分别说明一下。


一、OCX技术方案
1.OCX技术是IE的插件标准，使用OCX技术可以在IE加一个二进制代码插件，在IE或国产浏览器兼容模式下加载我们的CAD ocx，就能直接显示图纸。

运行效果：



4.前端代码引用方式，通过加载：

classid = "74A777F8-7A8F-4e7c-AF47-7074828086E2",

  Sys.ie || Sys.ie9 ? (document.write(" "),

  document.write(" "),

  document.write(' '),

  document.write('codebase=" ' + cabpath + 'width="85%" height="85%" align="left"> '),

  document.write(''),

  document.write(''),

  document.write(''),

  document.write(''),

  document.write(' '),

  document.write(''),

  document.write(''),

  document.write(' '),

  document.write(''),

  document.write(''),

  document.write(''),

  document.write(''),

  document.write(''),

  document.write(''),

  document.write(''),

  document.write('不能装载文档控件。请在检查浏览器的选项中检查浏览器的安全设置。请点击安装控件'),

  document.write('')) :优点：梦想CAD ocx有十年开发积累，开发接口非常丰富，功能最成熟，可以在网页里直接打开编辑CAD图纸，对服务器没有要求，也不需要在服务器安装插件。
缺点：对浏览器有要求，必须是IE，或IE内核浏览器，如果想在chrome浏览器上使用，必须使用我们指定安装的谷歌浏览器，而国产浏览器，QQ,360浏览器是可以在极速模式下使用，用户在第一次使用时，需要安装一下我们的插件，IE支持CAB安装包的自动安装。

HTML5技术方案
1.网页直接使用canvas渲染CAD图纸，chrome浏览器推使用该技术在网页显示二维，三维图形。

运行效果：



优点：跨平台，可以在手机，微信朋友圈，小程序，安桌，苹果系统上使用，只要有chrome内核的浏览器就能加载显示CAD图纸，不需要在用户端安装任何程序。
缺点：最近几年开发出来，所以相比OCX方案，编辑功能简单一些，开发接口也没有OCX成熟，需要在服务器后台调用我们的图纸转换程序对图纸格式转换。不过我们在不停完善，当前如果只需要浏览，批注，测量CAD图纸已经足够使用。

​详细功能对比较表格
功能说明OCX情况HTML5情况前端是否需要安装程序是否浏览器要求IE,支持国产浏览器QQ,360,chrome需要指定安装包,不支持火狐Chrome，火狐，国产浏览器。是否支持VUE可以简单支持，或使用iframe把ocx包起来完整支持图纸浏览直接打开后台转换加载显示编辑功能完整编辑功能，精简版本CAD支持，不完整，正在开发显示效率达到AutoCAD:89%显示加载图纸很快，超过AutoCAD是否跨平台只能windows所有平台前台开发语言JS,HTMLJS,TS,HTML5,THREE.JS 后台开发语言无JAVA,NODE.JS,ASP.NET,PHP,GO等都可以。前端系统要求Windows
Windows,安卓，Linux,苹果等所有系统 后端系统要求无，可以不在后台运行Windows,Linux后端转pdf,jpg支持，调用COM接口支持，调用我们的转换程序前端转pdf,jpg支持不支持协同功能不支持可以实现(定制功能)测量批注功能支持支持是否支持天正自定义实体不支持，必须保存T3格式。不支持，必须保存T3格式，但可以做到服务后台自动转T3(定制功能)图纸大小一般最大50M,具体看图纸内容复杂度一般最大50M,具体看图纸内容复杂度打印功能支持直接打印支持打印，使用canvas打印格式转换时间不需要转换，直接打开需要格式转换，一般情况10M图纸转换时间在10秒内canvas打印代码：

fun("print").οnclick=function(){

  var dataURL = canvas.toDataURL("image/png");

  var newWindow=window.open();

  newWindow.document.write('');

  newWindow.print();

}