Question

圆弧

我们可以通过实例化一个 McDbArc() 对象创建圆弧。

你可以通过设置 McDbArc() 实例对象的圆心 center 、半径 radius 、开始角度 startAngle 、结束角度 endAngle 绘制圆弧，也可以通过通过 McDbArc() 提供的 computeArc() 方法设置起点、中间点、结束点三点绘制圆弧。

此外，还可以通过 mxcad 实例提供的绘制圆弧的方法，如drawArc()，drawArc2()，drawArc3()。

点击 McDbArc() 查看详细属性和方法说明。

点击 drawArc()，drawArc2()，drawArc3() 查看详细属性和方法说明。

import { MxCpp, McGePoint3d, McDbArc, McCmColor } from "mxcad"

const mxcad = MxCpp.getCurrentMxCAD()
const arc = new McDbArc()
arc.center = new McGePoint3d(-100, -100),
arc.radius = 20
arc.startAngle = Math.PI / 2
arc.endAngle = Math.PI * 3 / 2
arc.trueColor = new McCmColor(255, 233, 0)
mxcad.drawEntity(arc)

const arc_1 = new McDbArc()
const pt1 = new McGePoint3d(-60,-80)
const pt2 = new McGePoint3d(-80,-100)
const pt3 = new McGePoint3d(-60,-120)
arc_1.computeArc(pt1.x,pt1.y,pt2.x,pt2.y,pt3.x,pt3.y)
mxcad.drawEntity(arc_1)

mxcad.drawArc(-120, -100, 20, 100, 250);
mxcad.drawArc2(pt1.x,pt1.y,pt2.x,pt2.y,pt3.x,pt3.y)
mxcad.drawArc3(pt1.x,pt1.y,pt2.x,pt2.y,0.2)

:::demo

import {  McObject, McDbArc, McGePoint3d, McCmColor } from "mxcad"

export default () => {
    const mxcad = new McObject()
    mxcad.create({
      canvas: "#myCanvas",
      locateFile: (fileName: string)=> {
            // CDN 加载必须使用wasm/2d-st中的资源、因为github的限制无法使用wasm/2d 资源
            // 需要使用wasm/2d需要遵循浏览器同源策略或使用其他手段规避浏览器同源策略
            return "https://unpkg.com/mxcad/dist/wasm/2d-st/" + fileName
      },
      // 加载字体的目录位置
      fontspath: self.location.origin + "/mxcad_docs/fonts",
      // 加载转换后的图纸文件
      fileUrl: self.location.origin + "/mxcad_docs/test.mxweb",
      onOpenFileComplete: ()=>{
            const arc = new McDbArc()
            arc.center = new McGePoint3d(-100, -100),
            arc.radius = 20
            arc.startAngle = Math.PI / 2
            arc.endAngle = Math.PI * 3 / 2
            arc.trueColor = new McCmColor(255, 233, 0)
            mxcad.drawEntity(arc)

            const arc_1 = new McDbArc()
            const pt1 = new McGePoint3d(-60,-80)
            const pt2 = new McGePoint3d(-80,-100)
            const pt3 = new McGePoint3d(-60,-120)
            arc_1.trueColor = new McCmColor(0, 255, 0)
            arc_1.computeArc(pt1.x,pt1.y,pt2.x,pt2.y,pt3.x,pt3.y)
            mxcad.drawEntity(arc_1)

            mxcad.drawArc(-120, -100, 20, 100, 250);

            mxcad.drawColor = new McCmColor(255,0, 0)
            mxcad.drawArc2(-80,-80,-100,-100,-80,-120)

            mxcad.drawColor = new McCmColor(0, 0, 255)
            mxcad.drawArc3(-40,-80,-40,-120,1)

            mxcad.zoomAll()
            mxcad.zoomScale(0.8)
      }
    })
    return (<div style="height: 500px; overflow: hidden;"><canvas id="myCanvas" ></canvas>
    </div>)
}

:::