DWG格式的圖紙是AutoCAD的私有格式，很多用戶需要在網(wǎng)頁端查看和編輯CAD圖紙，傳統(tǒng)的方式是企業(yè)購買夢(mèng)想CAD控件的OCX方案，此方案開發(fā)時(shí)間久且編輯功能豐富，但因新版谷歌瀏覽器不再支持AcitveX控件，因此更多的用戶希望以Html5的方式實(shí)現(xiàn)在線CAD功能，今天我們就來講一下夢(mèng)想CAD控件的H5方案如何在網(wǎng)頁顯示CAD圖紙。
1.我們需要先安裝Node環(huán)境來初始化一個(gè)工程化的前端項(xiàng)目，你可以按照文章一步一步操作，就可以安裝配置好Node環(huán)境。
2.有了Node環(huán)境就有了npm包管理工具，我們現(xiàn)在需要通過Vite這個(gè)打包工具初始化一個(gè)最簡單的前端項(xiàng)目，這里你可以直接參考vite官方文檔：
這里是讓你選擇一個(gè)前端的框架，本文以Vue為例。 如果你不知道什么是前端框架，或者不知道從這些框架只能選擇哪個(gè)，那么這里就選擇Vue吧，直接上下鍵選擇，回車鍵確定選擇，跟著我的步驟走就可以了：
如果你還是不懂這些是選擇什么，就選擇 TypeScript，因?yàn)楸疚膶?shí)例就是用TypeScript進(jìn)行開發(fā)的。
1.看見頁面覺得沒什么問題了，我們返回到命令行窗口， 按下ctrl + c退出頁面的服務(wù)，然后我們要安裝一下mxdraw 前端庫，我們渲染圖紙都是要圍繞它進(jìn)行的，接下來輸入命令:
這里還沒完，你并的項(xiàng)目中沒有/buf/hhhh.dwg所對(duì)應(yīng)的轉(zhuǎn)換后的渲染文件。所以，我們需要準(zhǔn)備一張CAD圖紙對(duì)他進(jìn)行一個(gè)轉(zhuǎn)換。用命令去轉(zhuǎn)圖紙你可能會(huì)覺得不好理解，我們可以使用云圖開發(fā)包軟件對(duì)CAD圖紙進(jìn)行轉(zhuǎn)換。具體的教程你可以一步一步按照操作去做就可以了。
這時(shí)把轉(zhuǎn)換后的buf目錄放在項(xiàng)目的public目錄下就可以了，要渲染這個(gè)CAD圖紙只需要把cadFile: /buf/hhhh.dwg改成自己轉(zhuǎn)換的圖紙名稱就可以運(yùn)行了。
