Skip to content
On this page

Star Shape

Below we will introduce how to use mxcad plug-in to achieve the function of drawing stars in CAD drawings, the function of the user to set the shape, size and drawing position of stars.

Function implementation

  1. Set the center point of the star, the inner radius and the number of vertices

We can call MxCADUiPrPoint take object to dynamically select the center of the star, Determine the position of the star map, called MxCADUiPrInt based on user input integer Numbers to determine the star on the number of vertices, Then call MxCADUiPrDist set up within the radius of star.

ts
const starVert = new MxCADUiPrInt()
starVert.setMessage("Enter the number of star vertices:")
const starNum = await starVert.go()
if (!starNum) return;

const getCenter = new MxCADUiPrPoint()
getCenter.setMessage("Specify the center point of the star:")
const center = await getCenter.go()
if (!center) return;

const getRadius1 = new MxCADUiPrDist();
// Set the center of the star as the base point
getRadius1.setBasePt(center);
getRadius1.setMessage('Please set the inner radius of the star:')
const rVal = await getRadius1.go();
if (!rVal) return;
const radius1 = getRadius1.value();
  1. Set the outer radius of the star and dynamically draw the star

Referring to the method we used to obtain the inner radius in the above step, Can call again MxCADUiPrDist set up the star outside radius. We can get the inner circle and the outer circle of the star at the position of the inner and outer radius of the star, Then call according to the number of star vertices we obtained in the above step McDbCircle.getPointAtDist() Methods Points are taken from the inner circle and the outer circle respectively. The last call McDbPolyline The star shape can be successfully drawn by connecting the points taken on the two circles.

ts
// Array of star endpoints
let pointsArr: McGePoint3d[] = []
//Acquire outer radius
const getRadius2 = new MxCADUiPrDist();
// Set the center of the star as the base point
getRadius2.setBasePt(center);
getRadius2.setMessage('Specifies the outer radius of the star:');
// Draw stars dynamically
getRadius2.setUserDraw((pt, pw) => {
    let circle2 = new McDbCircle(center.x, center.y, center.z, pt.distanceTo(center));
    let length1 = circle1.getLength();
    let length2 = circle2.getLength();
    if (!length1 || !length2) return;
    // Interval access point
    let pointArr: McGePoint3d[] = [];
    for (let i = 0; i < starNum * 2; i++) {
        let point1 = circle1.getPointAtDist(length1.val / (starNum * 2) * i);
        if (!point1.ret) return
        let point2 = circle2.getPointAtDist(length2.val / (starNum * 2) * i);
        if (!point2.ret) return
        if (i % 2 === 0) {
            pointArr.push(point1.val)
        } else {
            pointArr.push(point2.val)
        }
    }
    let pl = new McDbPolyline();
    pointArr.forEach(pt => {
        pl.addVertexAt(pt)
    })
    pl.isClosed = true
    pw.drawMcDbEntity(pl)
    pointsArr = [...pointArr]
})
const rVal2 = await getRadius2.go()
if (!rVal2) return;
// Draw stars with multiple lines and points
let mxcad = MxCpp.getCurrentMxCAD();
let pl = new McDbPolyline();
pointsArr.forEach(pt => {
    pl.addVertexAt(pt)
})
pl.isClosed = true;
mxcad.drawEntity(pl)

Function extension

  1. Implement custom star class

In order to facilitate subsequent management and modification of the entity, We can through inheritance McDbCustomEntity custom entity class to extend the star class.

ts
// Custom star class
class McDbTestStart extends McDbCustomEntity {
    // Define a point object inside McDbTestStart 
    // Star center point
    private center: McGePoint3d = new McGePoint3d();
    // The inner radius of a star
    private radius1: number;
    // Outer radius of a star
    private radius2: number;
    // Number of star vertices
    private vertNum: number;
    // constructor
    constructor(imp?: any) {
        super(imp);
    }
    // Create function
    public create(imp: any) {
        return new McDbTestStart(imp)
    }
    // Get class name
    public getTypeName(): string {
        return "McDbTestStart";
    }
    //Set or get the inner radiuss
    public set starRadius1(val: number) {
        this.radius1 = val;
    }
    public get starRadius1(): number {
        return this.radius1;
    }
    //Sets or gets the outer radius
    public set starRadius2(val: number) {
        this.radius2 = val;
    }
    public get starRadius2(): number {
        return this.radius2;
    }
    //Sets or gets the number of vertices
    public set starVertNum(val: number) {
        this.vertNum = val;
    }
    public get starVertNum(): number {
        return this.vertNum;
    }
    // Read from defined entity data center、radius1、 radius2
    public dwgInFields(filter: IMcDbDwgFiler): boolean {
        this.center = filter.readPoint("center").val;
        this.radius1 = filter.readDouble("radius1").val;
        this.radius2 = filter.readDouble("radius2").val;
        this.vertNum = filter.readLong("vertNum").val;
        return true;
    }
    // Write from defined entity data center、radius1、 radius2
    public dwgOutFields(filter: IMcDbDwgFiler): boolean {
        filter.writePoint("center", this.center);
        filter.writeDouble("radius1", this.radius1);
        filter.writeDouble("radius2", this.radius2);
        filter.writeLong("vertNum", this.vertNum);
        return true;
    }

    // Moves the pinch point of a custom object
    public moveGripPointsAt(iIndex: number, dXOffset: number, dYOffset: number, dZOffset: number) {
        this.assertWrite();
        this.center.x += dXOffset;
        this.center.y += dYOffset;
        this.center.z += dZOffset;
    };
    // Gets the pinch point of a custom object
    public getGripPoints(): McGePoint3dArray {
        let ret = new McGePoint3dArray()
        ret.append(this.center);
        return ret;
    };
    // Draw entity
    public worldDraw(draw: MxCADWorldDraw): void {
        const circle1 = new McDbCircle();
        circle1.center = this.center;
        circle1.radius = this.radius1;

        const circle2 = new McDbCircle();
        circle2.center = this.center;
        circle2.radius = this.radius2;

        let length1 = circle1.getLength().val;
        let length2 = circle2.getLength().val;
        if (!length1 || !length2) return;
        
        let pointArr: McGePoint3d[] = [];
        for (let i = 0; i < this.vertNum * 2; i++) {
            let point1 = circle1.getPointAtDist(length1 / (this.vertNum * 2) * i);
            if (!point1.ret) return
            let point2 = circle2.getPointAtDist(length2 / (this.vertNum * 2) * i);
            if (!point2.ret) return
            if (i % 2 === 0) {
                pointArr.push(point1.val)
            } else {
                pointArr.push(point2.val)
            }
        }
        let pl = new McDbPolyline();
        pointArr.forEach(pt => {
            pl.addVertexAt(pt)
        })
        pl.isClosed = true;
        draw.drawEntity(pl);
    }
    // Set the star center point
    public setCenter(pt: McGePoint3d) {
        this.assertWrite();
        this.center = pt.clone();
    }
    // Get the center point of the star
    public getCenter() {
        return this.center;
    }
}

Functional practice

Practical effects are as follows:

  • Click the star button to perform the Draw Star method
  • Follow the command line prompt steps to complete setting the number of star vertices
  • Set star center point, inner radius
  • Then set the outer radius of the star to dynamically draw the star
  • Determine the outer radius value and successfully draw the star shape