網頁載入CAD圖紙的兩個方案

夢想控制元件提供兩種技術在網頁中載入CAD圖紙，一個是OCX技術方案，另一個是HTML5技術方案，它們各有優缺點，使用者需根據實際情況進行選擇，下邊分別說明一下。

1.OCX技術是IE的外掛標準，使用OCX技術可以在IE加一個二進位制程式碼外掛，在IE或國產瀏覽器相容模式下載入我們的CAD ocx，就能直接顯示圖紙。

2.快速入門教程:

3.線上演示：

執行效果：

4.前端程式碼引用方式，透過<object>載入：

classid = "74A777F8-7A8F-4e7c-AF47-7074828086E2",
 
    Sys.ie || Sys.ie9 ? (document.write("<!-- 用來產生編輯狀態的ActiveX控制元件的JS指令碼-->   "),
    document.write("<!-- 因為微軟的ActiveX新機制，需要一個外部引入的js-->   "),
    document.write('<object id="'+ id + '" classid="clsid:' + classid + '" '),
   //document.write('width="85%" height="85%" align="left">   '),
    document.write('codebase=" ' + cabpath + 'width="85%" height="85%" align="left">   '),
    document.write('<param name="_Version" value="65536">  '),
    document.write('<param name="_ExtentX" value="24262">  '),
    document.write('<param name="_ExtentY" value="16219">  '),
    document.write('<param name="_StockProps" value="0">'),
    document.write('<param name="DwgFilePath" value="' + dwgfile + '" > '),
    document.write('<param name="IsRuningAtIE" value="1">'),
    document.write('<param name="EnablePrintCmd" value="1">  '),
    document.write('<param name="ShowCommandWindow" value="1">   '),
    document.write('<param name="ShowToolBars" value="1">  '),
    document.write('<param name="ShowModelBar" value="1">'),
    document.write('<param name="Iniset" value="">  '),
    document.write('<param name="ToolBarFiles" value="">'),
    document.write('<param name="ShowMenuBar" value="1">'),
    document.write('<param name="EnableUndo" value="1">'),
    document.write('<param name="ShowPropertyWindow" value="1">'),
    document.write('<SPAN STYLE="color:red">不能裝載文件控制元件。請在檢查瀏覽器的選項中檢查瀏覽器的安全設定。請點選<a href=' + msipath + '>安裝控制元件</a></SPAN>'),
    document.write('</object>')) :

1.網頁直接使用canvas渲染CAD圖紙，chrome瀏覽器推使用該技術在網頁顯示二維，三維圖形。

2.快速入門教程:

3.線上演示：

4.MxCAD雲圖相簿：

執行效果：

canvas列印程式碼：

fun("print").οnclick=function(){
    var dataURL = canvas.toDataURL("image/png");
    var newWindow=window.open();
    newWindow.document.write('<img src="'+dataURL+'"/>');
    newWindow.print();
 }