dxf-viewer文本高亮方案

我们最近使用ezdxf后端实现复杂dxf图纸。（工业一次系统图）

遇到一个问题，使用各类cad软件打开文字显示正常，但是放入前端dxf-viewer框架中档图缩小时候，文字是完全模糊不见的。

方案1：尝试切换各类字体、包括黑体。（无用）

方案2：切换各类其他前端dxf展示，作用也不大。

方案3：自己查看 dxf-viewer 源码，想通过了解底层实现逻辑来实现文本的高亮。

dxf-viewer：

使用three.js 来实现渲染的。

three.js 是可以通过修改字体、修改渲染效果的。

从这里入手：

1：监听dxf-viewer  渲染事件，

2：重新渲染和文本有关的entity。

首先，我们得自定义three.js 使用的字体，three.js 使用json格式字体，你需要自己在官网通过脚本等，转化为json字体。

this.dxfViewer = new DxfViewer(this.$refs.canvasContainer, this.options);
let scene = this.dxfViewer.GetScene();
// let orgin = new three.Vector3();
let origin = new three.Vector2();
origin = this.dxfViewer.GetOrigin();

this.dxfViewer.Subscribe('loaded', () => {
    console.log("dxf loaded event triggered! yxp");
    // 当文件加载完成后处理文本对象
    this.processTextObjects(scene, origin);
});

const Subscribe = eventName => {
    this.dxfViewer.Subscribe(eventName, e => this.$emit("dxf-" + eventName, e))
}
for (const eventName of ["loaded", "cleared", "destroyed", "resized", "pointerdown",
                         "pointerup", "viewChanged", "message"]) {
    Subscribe(eventName)
}

重点就是 processTextObjects函数

object.material = new three.MeshBasicMaterial({ color: highlightColor, fog: false,
wireframe: true, // 启用线框模式
wireframeLinewidth: 1, // 线条宽度
});

这样，文本就不在模糊不清了，

最后重新渲染即可。

this.dxfViewer.Render(); // 重新渲染