build-dxf

安装

npm i build-dxf

node 使用示例

import { DxfSystem, ModelDataPlugin, components, utils } from "build-dxf"
/**
 * json 文件格式为{ start: {x: number, y: number}, end: {x: number, y: number } , insetionArr: {index: number}[] }[]
 */
const path = process.argv[2] ?? "./json/d10.json"
const dxfSystem = new DxfSystem()

// 使用模型数据生成插件
dxfSystem.usePlugin(ModelDataPlugin)

// 获取白模数据生成组件
const whiteModel = dxfSystem.findComponentByType(components.WhiteModel)
// 获取详情点数据生成组件
const detailsPoint = dxfSystem.findComponentByType(components.DetailsPoint)
const threeVJia = dxfSystem.findComponentByName("ThreeVJia")

dxfSystem.Dxf.set(path).then(()=> {
    // 监听详情点数据处理完成
    detailsPoint.addEventListener("handleSuccess", () => {
        // 下载dxf文件
        dxfSystem.Dxf.download("01.dxf")
        // 下载白模，obj格式
        whiteModel.downloadOBJ("001.obj")
        // 下载白模，gltf或glb格式, 第二个参数为true时是glb，默认为true
        whiteModel.downloadGltf("001.glb", true)

        // 下载三维家 json 
        threeVJia.download("json.json")

        // 下载为图片
        dxfSystem.AngleCorrectionDxf.downloadImage("001.jpg")

        // 下载新json
        dxfSystem.Dxf.downloadOriginalData("data.json")

        // desPoints 为射线点集合，根据需要使用
        console.log("handleSuccess", detailsPoint.desPoints)
    })

    // trajectory222为轨迹文件数据
    dxfSystem.Dxf.addEventListener("preprocessing", ({ setData, data }) => {
        setData( utils.BoundExt.boundExtbyTraj(data, trajectory222 ) )
    }, { once: true })

    dxfSystem.Dxf.axisAlignCorr({ groupMethod: "cross", fittingMethod: "max", crossAxistThreshold: 0.08 })
    dxfSystem.Dxf.lineOffset()

    detailsPoint.set("./json/dp8.json")

    // 获取外扩后的三维家json
    const lines = utils.BoundExt.boundExtbyTraj({
        lines: dxfSystem.Dxf.getLineSegments(),
        trajectory: trajectoryJson // 轨迹json对象,
        wallWidth: 0.12,
        updateDoubleWallGroup: true
    }).lines

    // 三维家json
    const json = utils.lineDataToThreeVJiaJson(lines, dxfSystem.AngleCorrectionDxf.angle).toJson("测试")
})

浏览器编辑功能使用示例

<template>
    <div class="w-[100vw] h-[100vh]" ref="dom"> </div>
</template>

<style scoped></style>

<script setup lang="ts">
import data from "../data/d9.json"
import { createEditor } from "build-dxf"
import { onMounted, ref } from "vue"
import * as THREE from "three"
import  "build-dxf/index.css"

const dom = ref<HTMLDivElement>()

onMounted(async ()=>{
    if(dom.value) {
        const camera = new THREE.OrthographicCamera( -100, 100, 100, -100, 0.1, 1000 )
        const { dxfSystem } = await createEditor( dom.value, camera )
        dxfSystem.Dxf.set( (data as any) )
        dxfSystem.Dxf.lineOffset()
    }
})
</script>

浏览器 使用示例

<template>
    <div class="w-[100vw] h-[100vh]">
        <Dxf3DView :lines="(data as any)" :details-point="dp8" />
    </div>
</template>

<style scoped></style>

<script setup lang="ts">
import { Dxf3DView } from "build-dxf/RenderPlugin"
import  "build-dxf/index.css"
import data from "../data/d4.json"
import dp8 from "../data/dp8.json"
</script>

内置类

1. 核心类

1. DxfSystem

核心组件类

1. Dxf
2. AngleCorrectionDxf
3. DoorsAnalysis
4. ThreeVJia
5. Variable

2. 渲染插件组件类

1. Renderer
2. DomContainer
3. DomEventRegister
4. EventInput
5. DetailsPointRender
6. ModelDataRender
7. OriginalLineRender

3. 模型数据提供插件组件类

1. DetailsPoint
2. DxfLineModel
3. WhiteModel

4. 编辑器插件组件类

编辑器管理组件类

1. RenderManager
2. Editor

命令流组件类

1. CommandFlowComponent
2. Default
3. ClippingLine
4. ConnectionLine
5. DeleteSelectLine
6. DeleteSelectWindow
7. DrawDoorLine
8. DrawLine
9. DrawWindow
10. IntersectionConnectionLine
11. MergeLine
12. PointDrag
13. SelectAll
14. VerticalCorrection
15. VerticalReferenceLine
16. ViewAngle