(前端直接编辑CAD)网页CAD二次开发中线型表的使用方法

本文涉及的产品
容器镜像服务 ACR,镜像仓库100个 不限时长
云原生网关 MSE Higress,422元/月
函数计算FC,每月15万CU 3个月
简介: 在DWG数据库中,线型样式存储在线型样式表 `McDbLinetypeTable` 中,每个线型表记录对象 `McDbLinetypeTableRecord` 对应一种线型样式。本文介绍了如何获取、添加、遍历、删除和修改线型样式,并提供了绘制不同线型的示例代码,包括虚线、点划线和带文字的线型。通过在线示例demo,用户可以实践修改CAD图纸中的实体线型及其样式。

前言

在DWG数据库中,线型样式存放在线型样式表McDbLinetypeTable()中,线型样式表中每一条记录称为线型表记录对象McDbLinetypeTableRecord()。每一个线型表记录对象都对应着一种线型样式,其中线型样式是随图纸保存,不同的图纸使用的线型样式都可能不一样。

线型表操作

1.获取当前控件的线型样式表

通过调用mxcad中的MxCpp.getCurrentMxCAD()得到当前的控件, 然后调用控件实例的 getDatabase()方法得到数据库实例McDbDatabase(),在该数据库实例中调用 getLinetypeTable()方法我们就能获取到当前控件的线型样式表McDbLinetypeTable()。

点击[线型样式表McDbLinetypeTable()][线型表记录对象McDbLinetypeTableRecord()][数据库实例 McDbDatabase()]查看详细属性和方法说明。

   import {
    MxCpp} from "mxcad"
   // 得到当前控件
   const mxcad = MxCpp.getCurrentMxCAD();
   // 拿到当前线型样式表
   const lineTypeTable = mxcad.getDatabase().getLinetypeTable();

2.添加线型
我们可以直接调用mxcad实例对象中的addLinetype()方法或addLinetypeEx()方法添加线型样式,再设置 drawLinetype 属性将添加的线型样式设置为当前绘制线型样式。点击[McObject.addLinetype()][McObject.addLinetypeEx()]查看详细属性和方法说明。

   import {
    McApp } from "mxcad"
   const mxcad = McApp.getCurrentMxCAD()
   //定义虚线数据据,"MyLineType"是线型名,"6,-8"是虚线的一个单位定义,6是实线长,-8是空格长。
   mxcad.addLinetype("MyLineType", "6,-10");
   mxcad.addLinetypeEx("TestMyLine", '.5,-.2,["HW",STANDARD,S=.1,R=0.0,X=-0.1,Y=-.05],-.2',"");
   //设计当前线型为"MyLineType"
   mxcad.drawLinetype = "MyLineType";

此外,我们还可以通过得到当前数据库中的线型样式表McDbLinetypeTable(),然后向样式表中添加一个线型表记录对象McDbLinetypeTableRecord() 。

   import {
    McCmColor, MxCpp, McDbLinetypeTableRecord, McDb } from "mxcad"
   const mxcad = MxCpp.getCurrentMxCAD();
   // 拿到当前线型样式表
   let linetypeTable = mxcad.getDatabase().getLinetypeTable();
   // 创建一个线型记录对象
   let newLinetypeRecord = new McDbLinetypeTableRecord();
   // 设置线型虚线数量
   newLinetypeRecord.numDashes = 2;
   // 设置线型名
   newLinetypeRecord.name = "TestMyLine"
   // 添加线型
   if (linetypeTable.add(newLinetypeRecord).isValid()) {
   
   console.log("add ok");
   }

3.遍历所有线型

我们可以通过调用线型样式表 McDbLinetypeTable()中的getAllRecordId()方法获取所有线型样式的id,再调用getMcDbLinetypeTableRecord() 方法返回线型表记录对象 McDbLinetypeTableRecord() ,得到所有线型样式数据。

   import {
    MxCpp } from "mxcad"
   // 得到当前cad对象
   let mxcad = MxCpp.getCurrentMxCAD();
   // 获取线型表
   let linetypeTable = mxcad.getDatabase().getLinetypeTable();
   // 获取线型表中的所有记录对象id
   let aryId = linetypeTable.getAllRecordId();
   // 遍历线型记录对象id
   aryId.forEach((id) => {
   
       let linetypeRec = id.getMcDbLinetypeTableRecord();
       if (linetypeRec === null) return;
       console.log(linetypeRec);
       console.log("linetypeRec.name:" + linetypeRec.name);
   });

4.删除线型
我们得到目标线型表记录对象McDbLinetypeTableRecord()后可调用该对象实例的erase()方法删除对象。

   import {
    MxCpp } from "mxcad"
   // 获取线型表
   let linetypeTable = MxCpp.getCurrentMxCAD().getDatabase().getLinetypeTable()
   let linetypeId = linetypeTable.get("目标线型样式名")
   linetypeId.erase()
   // 更新显示
   mxcad.updateDisplay()

5.修改线型
mxcad 中修改线型的基础操作为删除原有线型,再重新添加定义线型,最后将目标对象新型设置为新增的线型,下面以让用户在CAD图上选择一个文字对象,然后操作对象所应用线型样式为例:

   import {
    MxCADSelectionSet, MxCADUiPrPoint, MxCADResbuf } from "mxcad"
   let mxcad = MxCpp.getCurrentMxCAD();
   // 把当图上,已经存的"TestMyLine"线型删除,为了mxcad.addLinetypeEx重新添加定义线型.
   let linetypeRecord = mxcad.database.getLinetypeTable().get("TestMyLine");
   if(!linetypeRecord.isErase()){
   
   linetypeRecord.erase();
   }
   // 添加线型定义TestMyLine
   let lintype = mxcad.addLinetypeEx("TestMyLine", '.5,-.2,["HW",STANDARD,S=.1,R=0.0,X=-0.1,Y=-.05],-.2',"");
   if(!lintype.isValid() )return;
   // 修改目标对象线型
   let getEnt = new MxCADUiPrEntity();
   let entId = await getEnt.go();
   let ent = entId.getMcDbEntity();
   if(!ent) return;
   ent.linetypeId = lintype;

实践操作

1.绘制不同线型的直线
1.1.绘制虚线的方法:

    let mxcad = MxCpp.getCurrentMxCAD();
       //绘制一个虚线
       //定义虚线数据据,"MyLineType"是线型名,"10,-6"是虚线的一个单位定义,10是实线长,-6是空格长。
       mxcad.addLinetype("MyLineType", "10,-6");
       //设计当前线型为"MyLineType"
       mxcad.drawLinetype = "MyLineType";
       // 绘制一个虚线
       mxcad.drawLine(0, 30, 100, 30);
       // 绘制一个带宽度的斜虚线
       mxcad.drawLineWidth = 5;
       mxcad.drawLine(200, 30, 300, 130);

效果如下图:
image-20241106104010113.png

1.2.点划线的方法:

       //绘制一个点划线虚线,"15,-5,3,-5"是虚线的一个单位定义,15,3是实线长,-5是空格长,虚线按照上面的顺序间隔为一个单位绘制。
       mxcad.addLinetype("MyLineType2", "15,-5,3,-5");
       //把线型改点划线
       mxcad.drawLinetype = "MyLineType2";
       // 修改绘线的颜色为 255(红色),  255转成16进制是0x0000FF,其中,00是蓝色,第个二00是绿色,FF是红色。
       mxcad.drawColor = new McCmColor(255, 0, 0);

       //绘制一个红色点划线。
       mxcad.drawLine(0, 120, 100, 120);
       // 绘制一个带宽度红色点划斜线
       mxcad.drawLineWidth = 4;
       mxcad.drawLine(200, 120, 300, 220);

效果如下图:
image-20241106104959946.png

1.3.带文字的线性:

       //增加一个带有形的线型
       mxcad.addTextStyle("MyLineTypeTextStyle", "txt.shx", "hztxt.shx", 1);
       mxcad.addLinetypeEx("MyLineType3", "(12.7,(\"T=MxDraw\",\"S=2.54\",\"L=-5.08\",\"R=0.0\",\"X=-2.54\",\"Y=-1.27\"),-10.08)", "MyLineTypeTextStyle");
       mxcad.drawLinetype = "MyLineType3";
       mxcad.drawLineWidth = 0;
       //绘制一个带文字。
       mxcad.drawLine(350, 120, 600, 120);

效果如下图:
image-20241106110122739.png

2.项目实践
我们提供了在线示例demo:https://demo.mxdraw3d.com:3000/mxcad/。
通过该demo在线修改CAD内图纸的实体线型,以及个性化设置每个实体的线型样式。其中,在修改线型比例前需要先确定实体的线型是否是虚线类,只有虚线类的线型才能支持修改线型,如果目标实体的线型是实线则需要先将修改实体的线型为虚线类再去修改线型比例,如下图:

image-20241106113416280.png
image-20241106113512711.png

相关文章
|
1月前
|
缓存 前端开发 JavaScript
前端开发的必修课:如何让你的网页在弱网环境下依然流畅运行?
【10月更文挑战第30天】随着移动互联网的普及,弱网环境下的网页性能优化变得尤为重要。本文详细介绍了如何通过了解网络状况、优化资源加载、减少HTTP请求、调整弱网参数和代码优化等方法,提升网页在弱网环境下的加载速度和流畅性,从而改善用户体验。
116 4
|
2天前
|
前端开发 JavaScript API
(前端3D模型开发)网页三维CAD中加载和保存STEP模型
本文介绍了如何使用`mxcad3d`库在网页上实现STEP格式三维模型的导入与导出。首先,通过官方教程搭建基本项目环境,了解核心对象如MxCAD3DObject、Mx3dDbDocument等的使用方法。接着,编写了加载和保存STEP模型的具体代码,包括HTML界面设计和TypeScript逻辑实现。最后,通过运行项目验证功能,展示了从模型加载到保存的全过程。此外,`mxcad3d`还支持多种其他格式的三维模型文件操作。
|
26天前
|
XML 前端开发 JavaScript
前端大神揭秘:如何让你的网页秒变炫酷,让用户欲罢不能的5大绝招!
前端开发不仅是技术活,更是艺术创作。本文揭秘五大前端开发技巧,包括合理运用CSS动画、SVG图形、现代JavaScript框架、优化网页性能及注重细节设计,助你打造炫酷网页,提升用户体验。
68 30
|
20天前
|
前端开发 数据处理 Android开发
Flutter前端开发中的调试技巧与工具使用方法,涵盖调试的重要性、基本技巧如打印日志与断点调试、常用调试工具如Android Studio/VS Code调试器和Flutter Inspector的介绍
本文深入探讨了Flutter前端开发中的调试技巧与工具使用方法,涵盖调试的重要性、基本技巧如打印日志与断点调试、常用调试工具如Android Studio/VS Code调试器和Flutter Inspector的介绍,以及具体操作步骤、常见问题解决、高级调试技巧、团队协作中的调试应用和未来发展趋势,旨在帮助开发者提高调试效率,提升应用质量。
40 8
|
20天前
|
缓存 JavaScript 前端开发
JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用
本文深入讲解了 JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用。
29 5
|
27天前
|
存储 编解码 前端开发
惊!前端新手也能秒懂的高级技巧,轻松提升网页颜值与性能!
本文针对前端新手,介绍了三个简单易学的高级技巧,帮助提升网页的颜值和性能。包括使用CSS框架快速美化网页、优化图片资源加快加载速度,以及利用ARIA属性和媒体查询提高网页的可访问性和响应性。示例代码清晰,适合初学者上手实践。
31 3
|
1月前
|
搜索推荐 前端开发 开发者
前端开发的必修课:如何让你的网页在搜索引擎中脱颖而出?
【10月更文挑战第31天】前端开发不仅是构建网页与用户间桥梁的关键,还需注重搜索引擎优化(SEO)。优化网页结构、合理使用关键词、提升加载速度及整合社交媒体等技巧,能帮助网页在搜索引擎中脱颖而出,吸引更多用户。
31 5
|
1月前
|
机器学习/深度学习 前端开发 JavaScript
前端小白也能学会的高大上技巧:如何让你的网页支持语音控制?
【10月更文挑战第31天】你是否曾梦想过只需动动嘴皮子就能操控网页?现在,这个梦想触手可及。即使你是前端小白,也能轻松学会让网页支持语音控制的高大上技巧。本文将介绍语音控制的基本概念、实现方法和具体示例,带你走进语音控制的奇妙世界。通过Web Speech API,你只需掌握基本的HTML、CSS和JavaScript知识,就能实现语音识别和控制功能。快来尝试吧!
122 4
|
1月前
|
前端开发 JavaScript 搜索推荐
前端小白也能学会的高大上技巧:如何让你的网页支持暗黑模式?
【10月更文挑战第30天】随着现代网页设计的发展,暗黑模式已成为一种流行趋势,提升了用户的阅读体验并增强了网页的适应性。本文介绍了如何通过简单的HTML、CSS和JavaScript实现网页的暗黑模式。首先,定义两种主题的CSS样式;然后,使用JavaScript实现模式切换逻辑,并自动检测系统主题。通过这些步骤,前端小白也能轻松掌握暗黑模式的实现,提升网页的用户体验和个性化水平。
51 4
|
1月前
|
前端开发 JavaScript 数据处理
前端界的宝藏技术:掌握这些,让你的网页秒变交互神器!
【10月更文挑战第31天】前端开发藏有众多宝藏技术,如JavaScript异步编程和Web Components。异步编程通过Promise、async/await实现复杂的网络请求,提高代码可读性;Web Components则允许创建可重用、封装良好的自定义组件,提升代码复用性和独立性。此外,CSS动画、SVG绘图等技术也极大丰富了网页的视觉和交互体验。不断学习和实践,让网页秒变交互神器。
29 2