4. H5版网页显示图纸集成步骤

1. 浏览器显示 CAD 图纸，实际上真正显示的是 CAD 图纸转换生成的 ocf 文件，需要将 ocf 文件传递给前端，H5 版控件就可以解析显示 ocf 文件。
2. 浏览器支持：支持主流的浏览器，比如 Chrome、火狐、Edge、360、QQ 等国产浏览器，IE 浏览器只支持IE11。
3. 样例代码必须部署到服务器中，本地 html 无法加载显示 ocf 文件。
4. 将 GStarSDK.js 文件后引入到 HTML 文本内的 script 标签中，前端所有的功能都是该文件提供的。
5. 第一步先初始化显示控件

属性	类型	必填	说明
wrapid	String	true	绘图容器的DOM ID（容器需要设置宽和高）
switchLayoutCB	Function	true	切换布局的回调函数，实现逻辑为获取相应布局数据重新开图，形参接收将切换的布局信息对象
apiHost	String	true	API域名，转换PDF、另存功能需要向该域名发送请求
tipsTime	Number	false	错误提示信息存在时间(毫秒)，默认3000（3秒）
mobileSizeLimit	Number	false	移动端可打开ocf文件的最大限制（字节数），默认5242880(5M)
pcSizeLimit	Number	false	PC端可打开ocf文件的最大限制（字节数），默认12582912(12M)
sizeLimitCB	Function	false	当ocf文件超过设置的最大值后，执行该回调函数，里面可以定义自己的业务逻辑
measureAccuracy	Number	false	测量数值的精度位数，默认是2
language	String	false	语言设置，可选'zh'（简中）/'en'(英语)/'ko'(韩语),默认'zh'
mode	String	false	填充显示模式 "default"：默认值，粗文字不填充，其他填充图案正常填充； "line"：所有元素都不填充； "fill"：所有需要填充元素都填充

// 初始化SDK
var gstarSDK = new GStarSDK({
    // 容器ID
    wrapId: 'webcad',
    // 点击布局功能会触发此回调
    switchLayoutCB: switchLayout,
    // API域名，转换PDF、另存功能需要向该域名发送请求，如果没有用的转PDF、版本转换功能，则无须关注这个参数。
    apiHost: window.location.host,
    // 错误提示信息存在时间(毫秒)，默认3000（3秒）
    tipsTime: 3000,
    // 移动端可打开ocf文件的最大限制（字节数），默认5242880(5M)
    mobileSizeLimit: 10242880,
    // PC端可打开ocf文件最大限制（字节数），默认12582912(12M)
    pcSizeLimit: 20582912,
    // 当ocf文件超过设置的最大值后，执行该回调函数
    sizeLimitCB: sizeLimit,
    // 语言设置，可选'zh'（简中）/'en'(英语)/'ko'(韩语),默认'zh'
    language: 'zh',
    // 测量数值的精度位数
    measureAccuracy: 3,
    // 填充显示模式，"default"：默认值，粗文字不填充，其他填充图案正常填充；"line"：所有元素都不填充；"fill"：所有需要填充元素都填充
    mode: 'default',
})

6. 第二步打开CAD图纸默认的ocf文件，defaultocfurl是ocf文件的url地址，render功能可以渲染显示ocf文件。

属性	类型	必填	说明
type	String	true	渲染数据的类型，现仅支持"ocf"格式
bufferData	arraybuffer	true	arraybuffer格式 二进制数据对象
fileId	String	true	当前图纸的唯一标识，转换pdf、版本转换功能，需要使用该参数
defaultViewport	Boolean	false	默认false:打开图纸时为视口为全图；true:打开图纸为图纸保存时默认视口

    // 初始化渲染默认ocf文件
    // 默认显示的ocf文件url地址
    //var defaultocfurl = 'http://localhost:63342/file/ocf/1001/test.ocf'
    var defaultocfurl = demoocfurl['*MODEL_SPACE'] || demoocfurl['*Model_Space'] || demoocfurl['default']
    getDrawSheet(defaultocfurl, function (arraybuffer) {
        gstarSDK.render('ocf', arraybuffer, fileId, true)
    })

7. 点击前端的布局功能，切换到其他布局，就会执行初始化时 switchLayoutCB 定义的回调函数，回调函数中的 src 是向后台发送请求连接，其中 globalName 是布局对应的名称。需要将该布局名作为参数传给后台，后台接收这个请求后，生成该布局名对应的 ocf 文件，然后返回 ocf 文件的 url 地址。前端接收后，就可以显示 ocf 文件了。
   向后台请求的这个连接，需要后台研发编码代码实现，接收前端这个请求，转换为 ocf 后返回。