3D批注完整功能集成说明

对于3DViewer，2DViewer相同的功能，原则上接口设计和调用方式是一致的。批注支持回显，添加，编辑，删除，选中等功能。集成各功能对应的接口，即可完成批注完整功能。

1. 批注功能交互流程图

2. 图文、引线批注方法说明和代码示例

批注控制类方法集成代码示例：

var nd_viewCtrl = {
  ...
  /** 控制类属性 */
  allTags: [],                              // 设置初始化回显的引线批注和图文批注数据集合
    
  /** 控制类方法 */
  tagOperateAdd: function(info, cc) {		// 添加批注，info：批注相关信息，参考下面截图，cc：回调函数，第一个参数是图片地址，第二个是视频地址，引线批注传入failed时撤销批注操作
	cc && cc(info.imageFile, info.videoFile);
  },
  
  tagOperateEdit: function(info, cc) {		// 编辑批注，info：批注相关信息，参考下面截图，cc：回调函数，第一个参数是图片地址，第二个是视频地址，，引线批注传入failed时撤销批注操作
	cc && cc(info.imageFile, info.videoFile);
  },
  
  beDelTag: function (uid, cc) {            // 删除批注，uid：删除批注的tagId，cc：回调函数
      cc && cc();
  },
  
  beSelectTag: function (i) {               // 预览打开图文批注的回调，i：预览批注的tagId
  },

  /** 控制类接口 */
  delTags: function (uuid) {                // 主动删除viewer内批注，uuid：批注的tagId
		var _contentWindow = document.getElementById("viewer").contentWindow;
		_contentWindow && _contentWindow.nd_delTags(uuid);
  },
  selectTag: function (uuid) {              // 主动预览viewer内批注，uuid：批注的tagId
		var _contentWindow = document.getElementById("viewer").contentWindow;
   		_contentWindow && _contentWindow.nd_selectTag(uuid);
   },
    
  /** 其它方法 */
  ...
}

注：图文批注在操作编辑和删除时，不执行cc()，批注效果停留在当前操作；引线批注可通过传入cc('failed')撤销添加和编辑操作。业务层集成时可自行控制。

其它批注控制类接口

说明：除上面示例接口delTags外，Viewer还提供了其它增强接口，以供集成方使用，参考：


方法名	说明	类型	参数	返回值
nd_addTag	新增图文批注，执行后会触发Viewer进入到图文批注功能	Function	-	void
nd_delTag	删除图文和引线批注	Function(id)	批注id	void
nd_selectTag	主动打开图文批注	Function(id)	批注id	void
nd_getAllTags	获取当前模型批注的集合	Function	-	Array
nd_updateTagtext	修改批注文案	Function(id,text)	id：String类型，批注id text：String类型，批注文案，字符串长度不能超过50	Object 更新文本后的批注对象
nd_clearTagStaus	图文批注清除防抖限制，点击确定按钮时可再次获取批注信息	Function	-	void

添加接口tagOperateAdd、编辑接口tagOperateEdit的info信息：

注：添加接口中imageFile为base64图片数据格式，videoFile为formData数据格式，file属性为视频数据；编辑接口如果图片或视频数据未更新，imageFile为http(s)字符串链接，videoFile为formData数据格式，src属性为原http(s)链接，如有更新同添加接口。
批注类型枚举：

旧版本添加、编辑接口：

注：建议使用新版添加tagOperateAdd、编辑tagOperateEdit接口；通过接口信息中的type区分不同类型批注；新旧接口同时配置时，旧版接口优先级更高。

var nd_viewCtrl = {
  ...
 /** 旧版本批注添加&编辑相关方法 */						
 // 添加文本批注回调，d：批注内容，i：批注图片，cc：回调函数
 addTags: function (d, i, cc) {
      cc && cc();
  },
  // 添加图文批注回调，d：批注内容，i：批注图片base64数据，cc：回调函数，cc参数i:回传一个新的图片地址
  addPicTag: function (d, i, cc) {
      cc && cc(i);
  },
  // 添加视频批注回调，d：批注内容，i：批注图片base64数据，v：视频文件流，cc：回调函数，cc参数i:回传一个新的图片地址，cc参数v:回传一个新的视频地址
  addVideoTag: function (d, i, v, cc) {
      cc && cc(i, v);
  },
   // 添加引线批注方法 d：批注信息，i：批注图片，cc回调参数
  addLineTag: function(d, i, cc) {
      cc && cc();
   },
   // 编辑引线批注回调，d：批注信息，i：图片信息，cc回调函数
   editLineTag: function(d, i, cc) {
      cc && cc();
   },
   // 编辑图文批注回调，d：批注内容，i：批注图片base64数据，cc：回调函数，cc参数i:回传一个新的图片地址
   editPicTag: function (d, i, cc) {
      cc && cc(i);
   },
   // 编辑视频批注回调，d：批注内容，i：批注图片base64数据，v：视频文件流，cc：回调函数，cc参数i:回传一个新的图片地址，cc参数v:回传一个新的视频地址
   editVideoTag: function (d, i, v, cc) {
      cc && cc(i, v);
   },
}

设置隐藏批注操作按钮
业务端可能存在权限判断，需要隐藏批注的删除、编辑按钮。可配置hidebtnCfg进行设置，代码示例
```
var nd_viewCtrl = {
  ...
  hidebtnCfg: ["#tag-can-edit", "#tag-can-del"],
  ...
}
```

3. 批注数据样例截图

单条图文批注数据，样例截图：
Figure 1. 图文批注：

Figure 2. 引线批注：

注：state中增加了物件objectid。
初始化时设置allTags进行批注回显，传入批注集合数据，样例截图：
集成方向服务器发起“添加批注”网络请求，样例截图：
说明：批注的外层结构集成方可自定义调整。添加图片或视频批注时，Viewer会回传对应的文件流，集成方将文件流转化成一个可预览的http地址，可以极大地减少数据大小。