谷歌浏览器打开DWG图纸,实现圆转多边形功能(在线CAD开发教程)

本文涉及的产品
服务治理 MSE Sentinel/OpenSergo,Agent数量 不受限
可观测可视化 Grafana 版,10个用户账号 1个月
简介: 本文介绍了如何使用在线CAD SDK实现圆转多边形功能。首先,需搭建绘图环境和添加命令行交互。接着,通过mxcad库,根据用户输入的边数实现两种转换方式:内接于圆(目标圆为多边形外接圆)和外切于圆(目标圆为多边形内切圆)。具体实现包括选中圆、获取边数、选择转换方式,然后根据用户选择绘制多边形。最终展示了转换效果。

前言

在线CAD SDK的集成过程中,甲方客户可能有实现圆转多边形功能的需求,作为开发者如何利用WEB CAD SDK展现此功能效果呢?本章节我们重点讲述一下。

环境搭建

  1. 搭建绘图环境,创建一个mxcad项目,具体操作请参考[mxcad|快速入门]。
  2. 在项目中添加命令行,实现功能的动态交互功能,具体操作请参考[mxcad|命令行]。

基于mxcad库实现圆转多边形功能

圆转多边形功能是根据用户输入的边数将目标圆转变成正多边形,其中转变方式分两种情况,一种是转换后的正多边形内接于目标圆,一种是转换后的正多边形外切于圆。下面我们将分别介绍如何实现这两种转换方式。

1.内接于圆:即目标圆为多边形的外接圆,它与多边形的每个顶点都相接。因此我们可以通过在目标圆上均匀取点找到多边形的所有顶点,最后通过多段线闭合连接成多边形,如下图:
image-20240402105127132.png

2.外切于圆:即目标圆为多边形的内切圆,它与多边形的每条边都相切,且与多边形的中心在同一直线上。因此我们可以通过获取多边形的外切圆反向绘制多边形。根据多边形条数求得多边形的每个内角度数,再根据目标圆的半径值可求的多边形外切圆半径值:目标圆半径 / sin(90 - (360 / (num * 2))),如下图所示:
image-20240402110513671.png

使用mxcad库实现完整圆转多边形功能

  1. 首先选中目标对象,选择时筛选出圆对象,参考代码如下:

    // 选中圆
    let filter = new MxCADResbuf();
    filter.AddMcDbEntityTypes("CIRCLE");
    let aryId = await MxCADUtility.userSelect("选择要转成多边形的对象", filter);
    if (aryId.length == 0) {
         
         
        return;
    }
    
  2. 通过命令行交互让用户设置多边形边数,默认为正五边形。

    let getNum = new MxCADUiPrInt();
    getNum.setMessage('设置多边形边数');
    let num = await getNum.go() || 5;
    getNum.clearLastInputPoint()
    if (!num) return;
    
  3. 然后让用户根据需求选择内接于圆或外切于圆的圆转多边形转换方式,默认选择内接于圆方式。

    const getPoint = new MxCADUiPrPoint();
    getPoint.setMessage("\n输入选项")
    getPoint.setKeyWords("[内接于圆(I)/外切于圆(C)]")
    getPoint.clearLastInputPoint()
    await getPoint.go();
    let tollType = 'inside'
    if (getPoint.isKeyWordPicked("i")) tollType = 'inside'
    if (getPoint.isKeyWordPicked("c")) tollType = 'outside'
    
  4. 最后根据用户输入关键字确定转换方式,绘制多边形。

    let mxcad = MxCpp.getCurrentMxCAD();
    aryId.forEach(async (id) => {
   
   
        let event: any = await id.getMcDbEntity();
        let cricle = event as McDbCircle;
        let arr1: McGePoint3d[] = [];
        if (tollType === 'inside') {
   
   
            //    多边形内切圆
            for (let i = 0; i < num; i++) {
   
   
                let point = cricle.getPointAtDist(cricle.getLength().val / num * i);
                if (point.ret) arr1.push(point.val)
            }
            let pl1 = new McDbPolyline();
            arr1.forEach(i => {
   
   
                pl1.addVertexAt(i)
            })
            pl1.isClosed = true;
            mxcad.drawEntity(pl1);
        } else if (tollType === 'outside') {
   
   
            //  多边形外切圆
            /**
             * 知道三个角加一条边求其他两边
             * 一条边:r
             * 三个角 90 360/num*2 
             */
            let angle = 90 - (360 / (num * 2))
            let sinValue = Math.sin(angle * Math.PI / 180); // 返回0.5
            let R = cricle.radius / sinValue;
            let r = new McDbCircle();
            r.center = cricle.center;
            r.radius = R;
            let arr2: McGePoint3d[] = [];
            for (let i = 0; i < num; i++) {
   
   
                let point = r.getPointAtDist(r.getLength().val / num * i);
                if (point.ret) arr2.push(point.val)
            }
            let pl2 = new McDbPolyline();
            arr2.forEach(i => {
   
   
                pl2.addVertexAt(i)
            })
            pl2.isClosed = true;
            mxcad.drawEntity(pl2);
        }
        event.erase()
    })

实现效果如下:
image-20240402112211243.png

相关文章
|
1月前
|
监控 前端开发 JavaScript
深入探索谷歌浏览器开发者工具:提升网页开发与调试效率的终极指南(一)
深入探索谷歌浏览器开发者工具:提升网页开发与调试效率的终极指南(一)
|
1天前
|
存储 算法 Java
栈:如何实现浏览器的前进和后退功能?
这篇文章讨论了计算机科学中的栈数据结构及其在浏览器前进、后退功能、函数调用、表达式求值和括号匹配等场景中的应用。栈是一种后进先出(LIFO)的数据结构,通常由数组或链表实现,具有入栈(添加元素)和出栈(移除最近添加的元素)的基本操作,时间复杂度为O(1)。文章通过实例解释了如何用栈来实现浏览器的前进和后退功能,以及在解析和求解数学表达式时如何利用栈来处理括号匹配。此外,还提到了栈在函数调用中的作用,即保存临时变量和管理调用顺序。文章以两个栈为例,详细描述了如何跟踪已浏览的网页历史记录,以便实现前进和后退功能。
|
4天前
|
Web App开发 XML 安全
《手把手教你》系列基础篇(七十三)-java+ selenium自动化测试-框架设计基础-TestNG实现启动不同浏览器(详解教程)
【6月更文挑战第14天】本文介绍了如何使用TestNg进行自动化测试,特别是通过变量参数启动不同浏览器的步骤。
15 5
|
7天前
|
数据可视化 安全 区块链
区块链钱包浏览器开发功能,价格和时间周期
开发区块链钱包浏览器涉及账户管理、交易查询、区块浏览、智能合约查询及数据可视化等功能。价格因开发难度、需求、团队专业度及第三方服务费用而异,通常在数万至数百万元。开发周期约数月到半年,包括需求分析、设计、开发、测试和上线等阶段。
区块链钱包浏览器开发功能,价格和时间周期
|
12天前
|
JavaScript
Vue - 超强实现网页禁止浏览器缩放功能
Vue - 超强实现网页禁止浏览器缩放功能
|
1月前
|
存储 缓存 前端开发
深入探索谷歌浏览器开发者工具:提升网页开发与调试效率的终极指南(二)
深入探索谷歌浏览器开发者工具:提升网页开发与调试效率的终极指南(二)
|
1月前
|
Web App开发 Java 测试技术
《手把手教你》系列技巧篇(二十六)-java+ selenium自动化测试-浏览器操作(详细教程)
【4月更文挑战第18天】本文介绍了Web自动化中的浏览器操作,包括如何打开不同类型的浏览器(如IE、Chrome、Firefox),以及进行页面操作如打开URL、浏览器最大化、刷新、前进和后退。还展示了如何设置浏览器位置和大小,以及获取当前URL和标题。此外,提供了项目实战例子,演示了如何用Selenium实现打开浏览器、设置位置和大小、搜索并执行页面操作的过程。文章最后提到一些其他可用的方法,并鼓励读者继续学习自动化测试相关知识。
85 3
|
1月前
|
Java 测试技术 定位技术
《手把手教你》系列技巧篇(二十三)-java+ selenium自动化测试-webdriver处理浏览器多窗口切换下卷(详细教程)
【4月更文挑战第15天】本文介绍了如何使用Selenium进行浏览器窗口切换以操作不同页面元素。首先,获取浏览器窗口句柄有两种方法:获取所有窗口句柄的集合和获取当前窗口句柄。然后,通过`switchTo().window()`方法切换到目标窗口句柄。在项目实战部分,给出了一个示例,展示了在百度首页、新闻页面和地图页面之间切换并输入文字的操作。最后,文章还探讨了在某些情况下可能出现的问题,并提供了一个简单的本地HTML页面示例来演示窗口切换的正确操作。
68 0
|
1月前
|
Java 测试技术 定位技术
《手把手教你》系列技巧篇(二十一)-java+ selenium自动化测试-浏览器窗口的句柄(详细教程)
【4月更文挑战第13天】本文介绍了如何获取浏览器窗口句柄,句柄是标识浏览器窗口的唯一ID。文章首先解释了窗口句柄的概念,然后通过Java代码示例展示了在单个、多个窗口句柄情况下的操作,包括打印单个窗口句柄和获取所有窗口句柄的方法。在多窗口句柄的场景中,代码演示了如何在不同标签页之间切换。最后,文章强调了句柄在实际操作中的重要性,特别是在处理多个窗口时。
54 0
|
1月前
|
JavaScript
浏览器插件crx文件--JS混淆与解密
浏览器插件crx文件--JS混淆与解密
50 0