Question

尺寸标注

标注是在图纸中用于提供关于尺寸、位置和方向等信息的一种图形元素；是进行图形识读和指导生产的主要技术依据。可以根据需求在多种方位上为各类对象创建标注。mxcad 中提供了对齐标注尺寸类和旋转标注尺寸类，若你有其他标注需求如：审图标注、箭头标注、云线标注等可参考 mxdraw库 中提供的尺寸标注方法。

标注常用概念说明 ： | 名称 | 描述 | 补充 | | :------ | :------ | :------ | | 标注文字 | 用于指示测量值的文字串 | 文字还可以包含前缀、后缀和公差 | | 尺寸线 | 用于指示标注的方向和范围 | 对于角度标注，尺寸线是一段圆弧 | | 箭头 | 显示在尺寸线两端 | 可以为箭头或斜线来指定不同的尺寸和造型 | | 尺寸边界 | 从部件延伸到尺寸线 | |

对齐标注尺寸类

我们可以通过实例化一个 McDbAlignedDimension() 对象创建对齐标注。通过设置 McDbAlignedDimension() 实例对象的标注线起始点 xLine1Point 、标注线结束点 xLine2Point、标注线位置点 dimLinePoint 以及标注文本附着方式 textAttachment、倾斜角度 oblique 等其他设置来绘制对齐标注。

此外，还可以通过 mxcad 实例对象提供的 drawDimAligned() 方法直接绘制对齐标注。

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

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

import { MxCpp, McGePoint3d, McCmColor, McDb, McDbAlignedDimension } from "mxcad"

const mxcad = MxCpp.getCurrentMxCAD()
const mDimension = new McDbAlignedDimension()
mDimension.xLine1Point = new McGePoint3d(-1800, 0)
mDimension.xLine2Point = new McGePoint3d(0, 0)
mDimension.dimLinePoint = new McGePoint3d(-500, -500)
mDimension.textAttachment = McDb.AttachmentPoint.kTopLeft
mDimension.trueColor = new McCmColor(200, 255, 0)
mDimension.oblique = 0
mxcad.drawEntity(mDimension)

mxcad.addDimStyle("MyDimStyle", "41,0.18,141,0.09,40,200", "77,1,271,3", "", "");
mxcad.drawDimStyle = "MyDimStyle"
mxcad.drawDimAligned(100,0, 2000, 0, 1200, 0);

旋转标注尺寸类

我们可以通过实例化一个 McDbRotatedDimension() 对象创建旋转标注。

此外，还可以通过 mxcad 实例对象提供的 drawDimRotated() 方法直接绘制旋转标注。

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

import { MxCpp, McGePoint3d, McCmColor, McDb, McDbRotatedDimension } from "mxcad"

const mxcad = MxCpp.getCurrentMxCAD()
const rDimension = new McDbRotatedDimension()
rDimension.xLine1Point = new McGePoint3d(100, -137)
rDimension.xLine2Point = new McGePoint3d(161,30)
rDimension.dimLinePoint = new McGePoint3d(80, -60)
rDimension.textAttachment = McDb.AttachmentPoint.kTopLeft
rDimension.textRotation = 1.5
rDimension.trueColor = new McCmColor(200, 255, 0)
rDimension.oblique = 0
rDimension.rotation = 0
mxcad.drawEntity(rDimension)

mxcad.addDimStyle("MyDimStyle", "41,0.18,141,0.09,40,200", "77,1,271,3", "", "");
mxcad.drawDimStyle = "MyDimStyle"
mxcad.drawDimRotated(0, 7000, 600, 7000, 250, 7050, 0);

角度标注

我们可以通过 mxcad 实例对象提供的 drawDimAngular() 方法直接绘制角度标注。

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

import { MxCpp } from "mxcad"

let mxcad = MxCpp.getCurrentMxCAD();

mxcad.addDimStyle("MyDimStyle2", "41,0.18,141,0.09,40,200", "77,1,271,3", "", "");
mxcad.drawDimStyle = "MyDimStyle2"
mxcad.drawDimAngular(500, 5000, 0, 5500, 1000, 5500, 500, 5500);

:::demo

import {  McObject, McDbRotatedDimension, McDbAlignedDimension, McDb, 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 mDimension = new McDbAlignedDimension()
            mDimension.xLine1Point = new McGePoint3d(-1800, 800)
            mDimension.xLine2Point = new McGePoint3d(1800,800)
            mDimension.dimLinePoint = new McGePoint3d(800, 500)
            mDimension.textAttachment = McDb.AttachmentPoint.kTopLeft
            mDimension.trueColor = new McCmColor(200, 255, 0)
            mDimension.oblique = 0
            mxcad.drawEntity(mDimension)

            const rDimension = new McDbRotatedDimension()
            rDimension.xLine1Point = new McGePoint3d(-1800, -800)
            rDimension.xLine2Point = new McGePoint3d(1800, -800)
            rDimension.dimLinePoint = new McGePoint3d(-800, -500)
            rDimension.textAttachment = McDb.AttachmentPoint.kTopLeft
            rDimension.textRotation = 0.6
            rDimension.trueColor = new McCmColor(200, 255, 0)
            rDimension.oblique = 0
            rDimension.rotation = 0
            rDimension.dimensionText = "标注文本"
            mxcad.drawEntity(rDimension)

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

:::