标牌管理 SceneLabelManager ​

const sceneLabelManager = await cloud.getSceneLabelManager()

const sceneLabelManager = await cloud.getSceneLabelManager()

await cloud.getSceneLabelManager()

await cloud.getSceneLabelManager()

async function pickNode(node: SceneLabelObject | null) {
console.warn(node)
}
const sceneLabelManager= await cloud.getSceneLabelManager();
await sceneLabelManager.setDbClickCallback(pickNode);

async function pickNode(node: SceneLabelObject | null) {
console.warn(node)
}
const sceneLabelManager= await cloud.getSceneLabelManager();
await sceneLabelManager.setDbClickCallback(pickNode);

// 标牌框架
const frameStyle: SceneLabelStyle = {
  bShow: true,//控制显隐 （选填）
  bShowByVisibleRange: false,//显隐根据显示范围控制 （选填）
  bSetScaleByDis : false,//近大远小 （选填）
  visibleInterval://显隐根据可视范围 （选填）
  {
    visibleMin: 0,//相机距离标牌最小距离 （选填）
    visibleMax: 99999999,//相机距离标牌最大距离 （选填）
  },
  wireFrame: {//引线 （选填）
    wireFrameType: 'LightLineWireFrame',//引线类型 'LightLineWireFrame'(发光引线) ,'EmptyWireFrame'(空引线)   （选填）
    dragDirection: 1,//拖拽方向 0（不可拖拽）1（任意方向） 2（x方向） 3（y方向）   （选填）
    lineColor: '0xffffffff',//颜色 仅支持 16 进制argb "0xffffffff"  （选填）
    wireWidth: 3,//1-5适宜  （选填）
    wireEndPointStyle: 4,//引线端点类型 0（控端点） 1（圆形） 2（三角） 3（方形） 4（五星）  （选填）
    offset://引线偏移   （选填）
      [0, //x方向  （选填）
        0],//y方向  （选填）
  },
}
// 用于变量替换的数据
const variableData :VariableData =
{
useLocalData:true,//使用网络数据还是本地数据  true使用'localData'  false使用'urlData'   （选填） 

// 参考例子中的conwfw,"conwfw"是变量，"wfwfwfewf"是变量对应的值。
// 如果在可使用变量的地方使用变量需要对"conwfw"增加识别符号变成"${conwfw}"。
// 目前可使用变量的地方为TextStyle的content,ImageStyle的content,ListStyle的content,ImageAndTextStyle与SelfDefineStyle的子样式的content。
// TextStyle的content如果值为"${conwfw}",则实际TextStyle的文本内容显示值为wfwfwfewf。
// 列表的变量数据支持对单个单元格的颜色支持,如果某个列表的单元格的值为"${item1-1}",则去找例子中的属性名"item1-1",
// 对应的属性值中"'0xffff0000'"为变量对应的颜色值,34°为变量对应的变量值</p>
// 
// localData:{
// "conwfw"   = "wfwfwfewf";
// "picture"   = "D:\\1.jpeg";
// "item1-1": "<p style=color:'0xffff0000';>34°</p>";
// }
localData:{//本地数据  （选填）
  文字: 'hello' //一个例子   （选填）
},
//请求url地址后会返回json类型的字符串，如下:
//{
//  "conwfw"   = "wfwfwfewf";
//  "picture"   = "D:\\1.jpeg";
//}

urlData:{//网络数据  （选填）
  alwaysRefresh :true,//是否持续请求url地址 true 持续请求  false 仅请求一次  （选填）
  refreshInterval :1,//持续请求间隔 单位s   （选填）
  url:'192.168.0.196:8089/mock/random?group=ddfa6a3a26964bd6b0dd622dc71ab8c9',  //url地址  请求内容格式为json  详细描述见url  （选填）
  method:'get' // 固定值 get请求获取  （必填）
}
}

// 文字标牌的样式
const textStyle :TextStyle = 
{
  type: 'Text' , //'Text'为文字样式标识,不可更改  (必填)
  content: '${文字}', //文字内容 (支持变量数据在VariableData参数中设置) (必填)
  style:{ //风格    (选填)
    labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
    font:{ //字体风格  (选填)
      family:'微软雅黑',//字样  (选填)
      size:26, //字体大小  (选填)
      color:'0xff00FFB1', //字体颜色 argb (选填)
      outline:{//轮廓线 (选填)
        color:'0xff00FFF3',//颜色 argb (选填)
        width:0// 宽度 0 1 2     (选填)
      }
    },
    border:{ //边框属性  (选填)
      color:'0xffffffff'//边框颜色 argb (选填)
    }, 
    background:{//背景  (选填)
      color:"0x330000ff"//背景色 argb  (选填)
    }
  },
  event:{   //点击触发事件 (选填)
    dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
      type:'event',
      content:{
        type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
      }
    },
  }
}

const sceneLabelManager = await cloud.getSceneLabelManager()
const layername = 'new'
const Pos = { x: 0, y: 0, z: 0 }
await sceneLabelManager.addTextSceneLabel(layername, Pos, textStyle, frameStyle,variableData)

// 标牌框架
const frameStyle: SceneLabelStyle = {
  bShow: true,//控制显隐 （选填）
  bShowByVisibleRange: false,//显隐根据显示范围控制 （选填）
  bSetScaleByDis : false,//近大远小 （选填）
  visibleInterval://显隐根据可视范围 （选填）
  {
    visibleMin: 0,//相机距离标牌最小距离 （选填）
    visibleMax: 99999999,//相机距离标牌最大距离 （选填）
  },
  wireFrame: {//引线 （选填）
    wireFrameType: 'LightLineWireFrame',//引线类型 'LightLineWireFrame'(发光引线) ,'EmptyWireFrame'(空引线)   （选填）
    dragDirection: 1,//拖拽方向 0（不可拖拽）1（任意方向） 2（x方向） 3（y方向）   （选填）
    lineColor: '0xffffffff',//颜色 仅支持 16 进制argb "0xffffffff"  （选填）
    wireWidth: 3,//1-5适宜  （选填）
    wireEndPointStyle: 4,//引线端点类型 0（控端点） 1（圆形） 2（三角） 3（方形） 4（五星）  （选填）
    offset://引线偏移   （选填）
      [0, //x方向  （选填）
        0],//y方向  （选填）
  },
}
// 用于变量替换的数据
const variableData :VariableData =
{
useLocalData:true,//使用网络数据还是本地数据  true使用'localData'  false使用'urlData'   （选填） 

// 参考例子中的conwfw,"conwfw"是变量，"wfwfwfewf"是变量对应的值。
// 如果在可使用变量的地方使用变量需要对"conwfw"增加识别符号变成"${conwfw}"。
// 目前可使用变量的地方为TextStyle的content,ImageStyle的content,ListStyle的content,ImageAndTextStyle与SelfDefineStyle的子样式的content。
// TextStyle的content如果值为"${conwfw}",则实际TextStyle的文本内容显示值为wfwfwfewf。
// 列表的变量数据支持对单个单元格的颜色支持,如果某个列表的单元格的值为"${item1-1}",则去找例子中的属性名"item1-1",
// 对应的属性值中"'0xffff0000'"为变量对应的颜色值,34°为变量对应的变量值</p>
// 
// localData:{
// "conwfw"   = "wfwfwfewf";
// "picture"   = "D:\\1.jpeg";
// "item1-1": "<p style=color:'0xffff0000';>34°</p>";
// }
localData:{//本地数据  （选填）
  文字: 'hello' //一个例子   （选填）
},
//请求url地址后会返回json类型的字符串，如下:
//{
//  "conwfw"   = "wfwfwfewf";
//  "picture"   = "D:\\1.jpeg";
//}

urlData:{//网络数据  （选填）
  alwaysRefresh :true,//是否持续请求url地址 true 持续请求  false 仅请求一次  （选填）
  refreshInterval :1,//持续请求间隔 单位s   （选填）
  url:'192.168.0.196:8089/mock/random?group=ddfa6a3a26964bd6b0dd622dc71ab8c9',  //url地址  请求内容格式为json  详细描述见url  （选填）
  method:'get' // 固定值 get请求获取  （必填）
}
}

// 文字标牌的样式
const textStyle :TextStyle = 
{
  type: 'Text' , //'Text'为文字样式标识,不可更改  (必填)
  content: '${文字}', //文字内容 (支持变量数据在VariableData参数中设置) (必填)
  style:{ //风格    (选填)
    labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
    font:{ //字体风格  (选填)
      family:'微软雅黑',//字样  (选填)
      size:26, //字体大小  (选填)
      color:'0xff00FFB1', //字体颜色 argb (选填)
      outline:{//轮廓线 (选填)
        color:'0xff00FFF3',//颜色 argb (选填)
        width:0// 宽度 0 1 2     (选填)
      }
    },
    border:{ //边框属性  (选填)
      color:'0xffffffff'//边框颜色 argb (选填)
    }, 
    background:{//背景  (选填)
      color:"0x330000ff"//背景色 argb  (选填)
    }
  },
  event:{   //点击触发事件 (选填)
    dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
      type:'event',
      content:{
        type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
      }
    },
  }
}

const sceneLabelManager = await cloud.getSceneLabelManager()
const layername = 'new'
const Pos = { x: 0, y: 0, z: 0 }
await sceneLabelManager.addTextSceneLabel(layername, Pos, textStyle, frameStyle,variableData)

// 标牌框架
const frameStyle: SceneLabelStyle = {
  bShow: true,//控制显隐 （选填）
  bShowByVisibleRange: false,//显隐根据显示范围控制 （选填）
  bSetScaleByDis : false,//近大远小 （选填）
  visibleInterval://显隐根据可视范围 （选填）
  {
    visibleMin: 0,//相机距离标牌最小距离 （选填）
    visibleMax: 99999999,//相机距离标牌最大距离 （选填）
  },
  wireFrame: {//引线 （选填）
    wireFrameType: 'LightLineWireFrame',//引线类型 'LightLineWireFrame'(发光引线) ,'EmptyWireFrame'(空引线)   （选填）
    dragDirection: 1,//拖拽方向 0（不可拖拽）1（任意方向） 2（x方向） 3（y方向）   （选填）
    lineColor: '0xffffffff',//颜色 仅支持 16 进制argb "0xffffffff"  （选填）
    wireWidth: 3,//1-5适宜  （选填）
    wireEndPointStyle: 4,//引线端点类型 0（控端点） 1（圆形） 2（三角） 3（方形） 4（五星）  （选填）
    offset://引线偏移   （选填）
      [0, //x方向  （选填）
        0],//y方向  （选填）
  },
}
// 用于变量替换的数据
const variableData :VariableData =
{
useLocalData:true,//使用网络数据还是本地数据  true使用'localData'  false使用'urlData'   （选填） 

 // 参考例子中的conwfw,"conwfw"是变量，"wfwfwfewf"是变量对应的值。
// 如果在可使用变量的地方使用变量需要对"conwfw"增加识别符号变成"${conwfw}"。
// 目前可使用变量的地方为TextStyle的content,ImageStyle的content,ListStyle的content,ImageAndTextStyle与SelfDefineStyle的子样式的content。
// TextStyle的content如果值为"${conwfw}",则实际TextStyle的文本内容显示值为wfwfwfewf。
// 列表的变量数据支持对单个单元格的颜色支持,如果某个列表的单元格的值为"${item1-1}",则去找例子中的属性名"item1-1",
// 对应的属性值中"'0xffff0000'"为变量对应的颜色值,34°为变量对应的变量值</p>
// 
// localData:{
// "conwfw"   = "wfwfwfewf";
// "picture"   = "D:\\1.jpeg";
// "item1-1": "<p style=color:'0xffff0000';>34°</p>";
// }
localData:{//本地数据  （选填）
  picture : "D:\\1.jpeg",//一个例子   （选填）
},
//请求url地址后会返回json类型的字符串，如下:
//{
 //    "conwfw"   = "wfwfwfewf";
 //    "picture"   = "D:\\1.jpeg";
 //    }

urlData:{//网络数据  （选填）
  alwaysRefresh :true,//是否持续请求url地址 true 持续请求  false 仅请求一次  （选填）
  refreshInterval :1,//持续请求间隔 单位s   （选填）
  url:'192.168.0.196:8089/mock/random?group=ddfa6a3a26964bd6b0dd622dc71ab8c9',  //url地址  请求内容格式为json  详细描述见url  （选填）
  method:'get' // 固定值 get请求获取  （必填）
}
}
// 图片标牌的样式
const imageStyle:ImageStyle=
{
  type: 'Image',  //'Image'为图片样式标识 不可更改  (必填)
  //content: '${picture}',  //图片地址 (必填)
  content: 'D:/clock.png',  //图片路径(必填) 支持本地路径和网络路径  支持变量数据  支持apng动图格式 (支持变量数据在VariableData参数中设置)
  style:{     //风格    (选填)
    labelPos :0, //原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
    background:{ //背景  (选填)
      color:"0x66ffffff"  //背景色 argb  (选填)
    },
    width:300, //图片宽 (选填)
    height:200  //图片高  (选填)
  },
  event:{   //点击触发事件 (选填)
    dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
      type:'event',
      content:{
        type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
      }
    },
  }
} 
const sceneLabelManager = await cloud.getSceneLabelManager()
const layername = 'new'
const Pos = { x: 0, y: 0, z: 0 }
await sceneLabelManager.addIconSceneLabel(layername, Pos, imageStyle, frameStyle,variableData)

// 标牌框架
const frameStyle: SceneLabelStyle = {
  bShow: true,//控制显隐 （选填）
  bShowByVisibleRange: false,//显隐根据显示范围控制 （选填）
  bSetScaleByDis : false,//近大远小 （选填）
  visibleInterval://显隐根据可视范围 （选填）
  {
    visibleMin: 0,//相机距离标牌最小距离 （选填）
    visibleMax: 99999999,//相机距离标牌最大距离 （选填）
  },
  wireFrame: {//引线 （选填）
    wireFrameType: 'LightLineWireFrame',//引线类型 'LightLineWireFrame'(发光引线) ,'EmptyWireFrame'(空引线)   （选填）
    dragDirection: 1,//拖拽方向 0（不可拖拽）1（任意方向） 2（x方向） 3（y方向）   （选填）
    lineColor: '0xffffffff',//颜色 仅支持 16 进制argb "0xffffffff"  （选填）
    wireWidth: 3,//1-5适宜  （选填）
    wireEndPointStyle: 4,//引线端点类型 0（控端点） 1（圆形） 2（三角） 3（方形） 4（五星）  （选填）
    offset://引线偏移   （选填）
      [0, //x方向  （选填）
        0],//y方向  （选填）
  },
}
// 用于变量替换的数据
const variableData :VariableData =
{
useLocalData:true,//使用网络数据还是本地数据  true使用'localData'  false使用'urlData'   （选填） 

 // 参考例子中的conwfw,"conwfw"是变量，"wfwfwfewf"是变量对应的值。
// 如果在可使用变量的地方使用变量需要对"conwfw"增加识别符号变成"${conwfw}"。
// 目前可使用变量的地方为TextStyle的content,ImageStyle的content,ListStyle的content,ImageAndTextStyle与SelfDefineStyle的子样式的content。
// TextStyle的content如果值为"${conwfw}",则实际TextStyle的文本内容显示值为wfwfwfewf。
// 列表的变量数据支持对单个单元格的颜色支持,如果某个列表的单元格的值为"${item1-1}",则去找例子中的属性名"item1-1",
// 对应的属性值中"'0xffff0000'"为变量对应的颜色值,34°为变量对应的变量值</p>
// 
// localData:{
// "conwfw"   = "wfwfwfewf";
// "picture"   = "D:\\1.jpeg";
// "item1-1": "<p style=color:'0xffff0000';>34°</p>";
// }
localData:{//本地数据  （选填）
  picture : "D:\\1.jpeg",//一个例子   （选填）
},
//请求url地址后会返回json类型的字符串，如下:
//{
 //    "conwfw"   = "wfwfwfewf";
 //    "picture"   = "D:\\1.jpeg";
 //    }

urlData:{//网络数据  （选填）
  alwaysRefresh :true,//是否持续请求url地址 true 持续请求  false 仅请求一次  （选填）
  refreshInterval :1,//持续请求间隔 单位s   （选填）
  url:'192.168.0.196:8089/mock/random?group=ddfa6a3a26964bd6b0dd622dc71ab8c9',  //url地址  请求内容格式为json  详细描述见url  （选填）
  method:'get' // 固定值 get请求获取  （必填）
}
}
// 图片标牌的样式
const imageStyle:ImageStyle=
{
  type: 'Image',  //'Image'为图片样式标识 不可更改  (必填)
  //content: '${picture}',  //图片地址 (必填)
  content: 'D:/clock.png',  //图片路径(必填) 支持本地路径和网络路径  支持变量数据  支持apng动图格式 (支持变量数据在VariableData参数中设置)
  style:{     //风格    (选填)
    labelPos :0, //原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
    background:{ //背景  (选填)
      color:"0x66ffffff"  //背景色 argb  (选填)
    },
    width:300, //图片宽 (选填)
    height:200  //图片高  (选填)
  },
  event:{   //点击触发事件 (选填)
    dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
      type:'event',
      content:{
        type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
      }
    },
  }
} 
const sceneLabelManager = await cloud.getSceneLabelManager()
const layername = 'new'
const Pos = { x: 0, y: 0, z: 0 }
await sceneLabelManager.addIconSceneLabel(layername, Pos, imageStyle, frameStyle,variableData)

// 标牌框架
const frameStyle: SceneLabelStyle = {
   bShow: true,//控制显隐 （选填）
   bShowByVisibleRange: false,//显隐根据显示范围控制 （选填）
   bSetScaleByDis : false,//近大远小 （选填）
   visibleInterval://显隐根据可视范围 （选填）
   {
     visibleMin: 0,//相机距离标牌最小距离 （选填）
     visibleMax: 99999999,//相机距离标牌最大距离 （选填）
   },
   wireFrame: {//引线 （选填）
     wireFrameType: 'LightLineWireFrame',//引线类型 'LightLineWireFrame'(发光引线) ,'EmptyWireFrame'(空引线)   （选填）
     dragDirection: 1,//拖拽方向 0（不可拖拽）1（任意方向） 2（x方向） 3（y方向）   （选填）
     lineColor: '0xffffffff',//颜色 仅支持 16 进制argb "0xffffffff"  （选填）
     wireWidth: 3,//1-5适宜  （选填）
     wireEndPointStyle: 4,//引线端点类型 0（控端点） 1（圆形） 2（三角） 3（方形） 4（五星）  （选填）
     offset://引线偏移   （选填）
       [0, //x方向  （选填）
         0],//y方向  （选填）
   },
 }
// 用于变量替换的数据
const variableData :VariableData =
{
 useLocalData:true,//使用网络数据还是本地数据  true使用'localData'  false使用'urlData'   （选填） 

  // 参考例子中的conwfw,"conwfw"是变量，"wfwfwfewf"是变量对应的值。
 // 如果在可使用变量的地方使用变量需要对"conwfw"增加识别符号变成"${conwfw}"。
 // 目前可使用变量的地方为TextStyle的content,ImageStyle的content,ListStyle的content,ImageAndTextStyle与SelfDefineStyle的子样式的content。
 // TextStyle的content如果值为"${conwfw}",则实际TextStyle的文本内容显示值为wfwfwfewf。
 // 列表的变量数据支持对单个单元格的颜色支持,如果某个列表的单元格的值为"${item1-1}",则去找例子中的属性名"item1-1",
 // 对应的属性值中"'0xffff0000'"为变量对应的颜色值,34°为变量对应的变量值</p>
 // 
 // localData:{
 // "conwfw"   = "wfwfwfewf";
 // "picture"   = "D:\\1.jpeg";
 // "item1-1": "<p style=color:'0xffff0000';>34°</p>";
 // }

 localData:{//本地数据  （选填）
   文字: 'hello',//一个例子   （选填）
   picture : "D:\\1.jpeg",//一个例子   （选填）
 },
 //请求url地址后会返回json类型的字符串，如下:
 //{
  //    "conwfw"   = "wfwfwfewf";
  //    "picture"   = "D:\\1.jpeg";
  //    }

 urlData:{//网络数据  （选填）
   alwaysRefresh :true,//是否持续请求url地址 true 持续请求  false 仅请求一次  （选填）
   refreshInterval :1,//持续请求间隔 单位s   （选填）
   url:'192.168.0.196:8089/mock/random?group=ddfa6a3a26964bd6b0dd622dc71ab8c9',  //url地址  请求内容格式为json  详细描述见url  （选填）
   method:'get' // 固定值 get请求获取  （必填）
 }
}
// 文字标牌的样式
const textStyle :TextStyle = 
{
   type: 'Text' , //'Text'为文字样式标识 不可更改  (必填)
   content: '${文字}', //文字内容  (必填) (支持变量数据在VariableData参数中设置)
   style:{ //风格    (选填)
     labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
     font:{ //字体风格  (选填)
       family:'微软雅黑',//字样  (选填)
       size:26, //字体大小  (选填)
       color:'0xff00FFB1', //字体颜色 argb (选填)
       outline:{//轮廓线 (选填)
         color:'0xff00FFF3',//颜色 argb (选填)
         width:0// 宽度 0 1 2     (选填)
       }
     },
     border:{ //边框属性  (选填)
       color:'0xffffffff'//边框颜色 argb (选填)
     }, 
     background:{//背景  (选填)
       color:"0x330000ff"//背景色 argb  (选填)
     }
   }
}

// 图片标牌的样式
const imageStyle:ImageStyle=
{
   type: 'Image',  //'Image'为图片样式标识 不可更改 (必填)
   //content: '${picture}',  //图片地址 (必填)
   content: 'D:/clock.png',   //图片路径(必填) 支持本地路径和网络路径  支持apng动图格式 (支持变量数据在VariableData参数中设置)
   style:{     //风格    (选填)
     labelPos :0, //原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
     background:{ //背景  (选填)
       color:"0x66ffffff"  //背景色 argb  (选填)
     },
     width:300, //图片宽 (选填)
     height:200  //图片高  (选填)
   }
} 
// 文字加图片标牌的样式
const imageAndTextStyle :ImageAndTextStyle ={
 type: 'ImageAndText', //'ImageAndText'指图片加文字标识  不可更改 （必填）
 content: [textStyle,imageStyle],  //textStyle文本风格接口,imageStyle图片风格接口 （必填）  
 style:{ //风格   
   labelPos:0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
   textToImagePos:2//文字相对图片的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
 },
 event:{   //点击触发事件 (选填)
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
       type:'event',
       content:{
         type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
       }
     },
   }
}
const sceneLabelManager = await cloud.getSceneLabelManager()
 const layername = 'new'
 const Pos = { x: 20, y: 20, z: 20 }
 await sceneLabelManager.addIconTextSceneLabel(layername, Pos,imageAndTextStyle , frameStyle,variableData)

// 标牌框架
const frameStyle: SceneLabelStyle = {
   bShow: true,//控制显隐 （选填）
   bShowByVisibleRange: false,//显隐根据显示范围控制 （选填）
   bSetScaleByDis : false,//近大远小 （选填）
   visibleInterval://显隐根据可视范围 （选填）
   {
     visibleMin: 0,//相机距离标牌最小距离 （选填）
     visibleMax: 99999999,//相机距离标牌最大距离 （选填）
   },
   wireFrame: {//引线 （选填）
     wireFrameType: 'LightLineWireFrame',//引线类型 'LightLineWireFrame'(发光引线) ,'EmptyWireFrame'(空引线)   （选填）
     dragDirection: 1,//拖拽方向 0（不可拖拽）1（任意方向） 2（x方向） 3（y方向）   （选填）
     lineColor: '0xffffffff',//颜色 仅支持 16 进制argb "0xffffffff"  （选填）
     wireWidth: 3,//1-5适宜  （选填）
     wireEndPointStyle: 4,//引线端点类型 0（控端点） 1（圆形） 2（三角） 3（方形） 4（五星）  （选填）
     offset://引线偏移   （选填）
       [0, //x方向  （选填）
         0],//y方向  （选填）
   },
 }
// 用于变量替换的数据
const variableData :VariableData =
{
 useLocalData:true,//使用网络数据还是本地数据  true使用'localData'  false使用'urlData'   （选填） 

  // 参考例子中的conwfw,"conwfw"是变量，"wfwfwfewf"是变量对应的值。
 // 如果在可使用变量的地方使用变量需要对"conwfw"增加识别符号变成"${conwfw}"。
 // 目前可使用变量的地方为TextStyle的content,ImageStyle的content,ListStyle的content,ImageAndTextStyle与SelfDefineStyle的子样式的content。
 // TextStyle的content如果值为"${conwfw}",则实际TextStyle的文本内容显示值为wfwfwfewf。
 // 列表的变量数据支持对单个单元格的颜色支持,如果某个列表的单元格的值为"${item1-1}",则去找例子中的属性名"item1-1",
 // 对应的属性值中"'0xffff0000'"为变量对应的颜色值,34°为变量对应的变量值</p>
 // 
 // localData:{
 // "conwfw"   = "wfwfwfewf";
 // "picture"   = "D:\\1.jpeg";
 // "item1-1": "<p style=color:'0xffff0000';>34°</p>";
 // }

 localData:{//本地数据  （选填）
   文字: 'hello',//一个例子   （选填）
   picture : "D:\\1.jpeg",//一个例子   （选填）
 },
 //请求url地址后会返回json类型的字符串，如下:
 //{
  //    "conwfw"   = "wfwfwfewf";
  //    "picture"   = "D:\\1.jpeg";
  //    }

 urlData:{//网络数据  （选填）
   alwaysRefresh :true,//是否持续请求url地址 true 持续请求  false 仅请求一次  （选填）
   refreshInterval :1,//持续请求间隔 单位s   （选填）
   url:'192.168.0.196:8089/mock/random?group=ddfa6a3a26964bd6b0dd622dc71ab8c9',  //url地址  请求内容格式为json  详细描述见url  （选填）
   method:'get' // 固定值 get请求获取  （必填）
 }
}
// 文字标牌的样式
const textStyle :TextStyle = 
{
   type: 'Text' , //'Text'为文字样式标识 不可更改  (必填)
   content: '${文字}', //文字内容  (必填) (支持变量数据在VariableData参数中设置)
   style:{ //风格    (选填)
     labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
     font:{ //字体风格  (选填)
       family:'微软雅黑',//字样  (选填)
       size:26, //字体大小  (选填)
       color:'0xff00FFB1', //字体颜色 argb (选填)
       outline:{//轮廓线 (选填)
         color:'0xff00FFF3',//颜色 argb (选填)
         width:0// 宽度 0 1 2     (选填)
       }
     },
     border:{ //边框属性  (选填)
       color:'0xffffffff'//边框颜色 argb (选填)
     }, 
     background:{//背景  (选填)
       color:"0x330000ff"//背景色 argb  (选填)
     }
   }
}

// 图片标牌的样式
const imageStyle:ImageStyle=
{
   type: 'Image',  //'Image'为图片样式标识 不可更改 (必填)
   //content: '${picture}',  //图片地址 (必填)
   content: 'D:/clock.png',   //图片路径(必填) 支持本地路径和网络路径  支持apng动图格式 (支持变量数据在VariableData参数中设置)
   style:{     //风格    (选填)
     labelPos :0, //原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
     background:{ //背景  (选填)
       color:"0x66ffffff"  //背景色 argb  (选填)
     },
     width:300, //图片宽 (选填)
     height:200  //图片高  (选填)
   }
} 
// 文字加图片标牌的样式
const imageAndTextStyle :ImageAndTextStyle ={
 type: 'ImageAndText', //'ImageAndText'指图片加文字标识  不可更改 （必填）
 content: [textStyle,imageStyle],  //textStyle文本风格接口,imageStyle图片风格接口 （必填）  
 style:{ //风格   
   labelPos:0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
   textToImagePos:2//文字相对图片的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
 },
 event:{   //点击触发事件 (选填)
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
       type:'event',
       content:{
         type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
       }
     },
   }
}
const sceneLabelManager = await cloud.getSceneLabelManager()
 const layername = 'new'
 const Pos = { x: 20, y: 20, z: 20 }
 await sceneLabelManager.addIconTextSceneLabel(layername, Pos,imageAndTextStyle , frameStyle,variableData)

// 标牌框架
const frameStyle: SceneLabelStyle = {
   bShow: true,//控制显隐 （选填）
   bShowByVisibleRange: false,//显隐根据显示范围控制 （选填）
   bSetScaleByDis : false,//近大远小 （选填）
   visibleInterval://显隐根据可视范围 （选填）
   {
     visibleMin: 0,//相机距离标牌最小距离 （选填）
     visibleMax: 99999999,//相机距离标牌最大距离 （选填）
   },
   wireFrame: {//引线 （选填）
     wireFrameType: 'LightLineWireFrame',//引线类型 'LightLineWireFrame'(发光引线) ,'EmptyWireFrame'(空引线)   （选填）
     dragDirection: 1,//拖拽方向 0（不可拖拽）1（任意方向） 2（x方向） 3（y方向）   （选填）
     lineColor: '0xffffffff',//颜色 仅支持 16 进制argb "0xffffffff"  （选填）
     wireWidth: 3,//1-5适宜  （选填）
     wireEndPointStyle: 4,//引线端点类型 0（控端点） 1（圆形） 2（三角） 3（方形） 4（五星）  （选填）
     offset://引线偏移   （选填）
       [0, //x方向  （选填）
         0],//y方向  （选填）
   },
 }
// 用于变量替换的数据 按钮不支持该接口  填空即可 
const variableData :VariableData =
{
}
// 按钮标牌的样式
const pushbuttonStyle :ButtonStyle=
{
   type:'Pushbutton',  //'Pushbutton'为按钮标识  (必填)
   content:`${labelsUrl}playground/public/teslaImg/tesla_log.png`,  //图片地址  支持本地路径和网络路径 不支持变量 (必填)
   style:{//风格    (选填)
     labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
     background:{//背景  (选填)
       color:"0x66ff00ff" //背景色 argb  (选填)
     },
     model:2,//按钮形态  1 （没有按钮弹起效果） 2 （有弹起效果）  (选填)
     width:100,  // 按钮宽度   (必填)
     height:30    //按钮高度   (必填)
   },
   event:{   //点击触发事件 (选填)
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息  (选填)
       type:'event',
       content:{
         type:'LabelDbClickFinish',
       }
     },
   }
}
const sceneLabelManager = await cloud.getSceneLabelManager()
 const layername = 'new'
 const Pos = { x: 0, y: 0, z: 0 }
 await sceneLabelManager.addButtonSceneLabel(layername, Pos,pushbuttonStyle , frameStyle,variableData)

// 标牌框架
const frameStyle: SceneLabelStyle = {
   bShow: true,//控制显隐 （选填）
   bShowByVisibleRange: false,//显隐根据显示范围控制 （选填）
   bSetScaleByDis : false,//近大远小 （选填）
   visibleInterval://显隐根据可视范围 （选填）
   {
     visibleMin: 0,//相机距离标牌最小距离 （选填）
     visibleMax: 99999999,//相机距离标牌最大距离 （选填）
   },
   wireFrame: {//引线 （选填）
     wireFrameType: 'LightLineWireFrame',//引线类型 'LightLineWireFrame'(发光引线) ,'EmptyWireFrame'(空引线)   （选填）
     dragDirection: 1,//拖拽方向 0（不可拖拽）1（任意方向） 2（x方向） 3（y方向）   （选填）
     lineColor: '0xffffffff',//颜色 仅支持 16 进制argb "0xffffffff"  （选填）
     wireWidth: 3,//1-5适宜  （选填）
     wireEndPointStyle: 4,//引线端点类型 0（控端点） 1（圆形） 2（三角） 3（方形） 4（五星）  （选填）
     offset://引线偏移   （选填）
       [0, //x方向  （选填）
         0],//y方向  （选填）
   },
 }
// 用于变量替换的数据 按钮不支持该接口  填空即可 
const variableData :VariableData =
{
}
// 按钮标牌的样式
const pushbuttonStyle :ButtonStyle=
{
   type:'Pushbutton',  //'Pushbutton'为按钮标识  (必填)
   content:`${labelsUrl}playground/public/teslaImg/tesla_log.png`,  //图片地址  支持本地路径和网络路径 不支持变量 (必填)
   style:{//风格    (选填)
     labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
     background:{//背景  (选填)
       color:"0x66ff00ff" //背景色 argb  (选填)
     },
     model:2,//按钮形态  1 （没有按钮弹起效果） 2 （有弹起效果）  (选填)
     width:100,  // 按钮宽度   (必填)
     height:30    //按钮高度   (必填)
   },
   event:{   //点击触发事件 (选填)
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息  (选填)
       type:'event',
       content:{
         type:'LabelDbClickFinish',
       }
     },
   }
}
const sceneLabelManager = await cloud.getSceneLabelManager()
 const layername = 'new'
 const Pos = { x: 0, y: 0, z: 0 }
 await sceneLabelManager.addButtonSceneLabel(layername, Pos,pushbuttonStyle , frameStyle,variableData)

// 标牌框架
const frameStyle: SceneLabelStyle = {
  bShow: true,//控制显隐 （选填）
  bShowByVisibleRange: false,//显隐根据显示范围控制 （选填）
  bSetScaleByDis : false,//近大远小 （选填）
  visibleInterval://显隐根据可视范围 （选填）
  {
    visibleMin: 0,//相机距离标牌最小距离 （选填）
    visibleMax: 99999999,//相机距离标牌最大距离 （选填）
  },
  wireFrame: {//引线 （选填）
    wireFrameType: 'LightLineWireFrame',//引线类型 'LightLineWireFrame'(发光引线) ,'EmptyWireFrame'(空引线)   （选填）
    dragDirection: 1,//拖拽方向 0（不可拖拽）1（任意方向） 2（x方向） 3（y方向）   （选填）
    lineColor: '0xffffffff',//颜色 仅支持 16 进制argb "0xffffffff"  （选填）
    wireWidth: 3,//1-5适宜  （选填）
    wireEndPointStyle: 4,//引线端点类型 0（控端点） 1（圆形） 2（三角） 3（方形） 4（五星）  （选填）
    offset://引线偏移   （选填）
      [0, //x方向  （选填）
        0],//y方向  （选填）
  },
}
// 用于变量替换的数据
const variableData :VariableData =
{
useLocalData:true,//使用网络数据还是本地数据  true使用'localData'  false使用'urlData'   （选填） 

 // 参考例子中的conwfw,"conwfw"是变量，"wfwfwfewf"是变量对应的值。
// 如果在可使用变量的地方使用变量需要对"conwfw"增加识别符号变成"${conwfw}"。
// 目前可使用变量的地方为TextStyle的content,ImageStyle的content,ListStyle的content,ImageAndTextStyle与SelfDefineStyle的子样式的content。
// TextStyle的content如果值为"${conwfw}",则实际TextStyle的文本内容显示值为wfwfwfewf。
// 列表的变量数据支持对单个单元格的颜色支持,如果某个列表的单元格的值为"${item1-1}",则去找例子中的属性名"item1-1",
// 对应的属性值中"'0xffff0000'"为变量对应的颜色值,34°为变量对应的变量值</p>
// 
// localData:{
// "conwfw"   = "wfwfwfewf";
// "picture"   = "D:\\1.jpeg";
// "item1-1": "<p style=color:'0xffff0000';>34°</p>";
// }
localData:{//本地数据  （选填）
  conwfw: 'hello', //一个例子   （选填）
  data:[    //适用于列表                     
     {
        'key':'1.1',  
        'value': '1.2', 
      },
      {
        'key':'2.1',  
        'value': '2.2',    
      },
    ],
},
//请求url地址后会返回json类型的字符串，如下:
//{
 //    "conwfw"   = "wfwfwfewf";
 //    "picture"   = "D:\\1.jpeg";
 //    }

urlData:{//网络数据  （选填）
  alwaysRefresh :true,//是否持续请求url地址 true 持续请求  false 仅请求一次  （选填）
  refreshInterval :1,//持续请求间隔 单位s   （选填）
  url:'192.168.0.196:8089/mock/random?group=ddfa6a3a26964bd6b0dd622dc71ab8c9',  //url地址  请求内容格式为json  详细描述见url  （选填）
  method:'get' // 固定值 get请求获取  （必填）
}
}

// 列表标牌的样式
const listStyle : ListStyle = 
{
  type:'List',  //'List'为列表标识  (必填)
  style:{   //列表样式  (选填)
    page: {  //翻页 (选填)
    position: 1,  //翻页位置  总体居上 0 居左 1 居中 2居右  (选填)
    prevStyle: { //上翻页按钮  (必填)
      background:{ //背景 (必填)
        color:'0xffffffff', //按钮颜色 argb   (选填)
        image:`${labelsUrl}playground/public/teslaImg/pageup.png`, //图片地址 (必填)
      },
      width: 32,//图片宽  (必填)
      height: 32,//图片高  (必填)
    },
    nextStyle: {  //下翻页按钮 (必填)
      background:{ //背景 (必填)
        color:'0xffffffff',//按钮颜色 argb (选填)
        image:`${labelsUrl}playground/public/teslaImg/pagedown.png`,//图片地址 (必填)
      }, 
      width: 32,//图片宽  (必填)
      height: 32,//图片高  (必填)
    },
    showPageStyle:{//显示页数的标签样式  （选填）
      font:{
       color:"0xffffff55",//字体颜色
       family:"宋体",//字体种类
       size:30//字体大小
      }
    }
  },
  captionStyle: { //标题  （选填）
    position: 1, //翻页位置 总体居下 0 居左 1 居中 2居右  （选填）
    font: {  //字体风格  （选填）
      family: '微软雅黑',//字样  (选填)  
      size: 26,//字体大小  (选填)
      color: '0xffffffff',//字体颜色 argb (选填)
      outline: {//轮廓线 (选填)
        width: 1,// 宽度 0 1 2     (选填)
        color: '0xffffffff',//颜色 argb (选填)
      },
    },
    width: 200,//标题宽度 （必填）
    height: 80,//标题高度  （必填）
  },
  bodyStyle:{ //列表内容 单元格的总体样式  （选填）
    width:150, // 每个单元格的宽度  （选填）
    height:30 //每个单元格的高度     （选填）
  },
  keyCellStyle: { // 第一列单元格样式   （选填）
    font: {//字体风格   （选填）
      family: '微软雅黑',//字样  (选填)
      size: 24,//字体大小  (选填)
      color: '0xffff0000',//字体颜色 argb (选填)
      outline: {//轮廓线 (选填)
        width: 0,// 宽度 0 1 2     (选填)
        color: '0xffffffff',//颜色 argb (选填)
      },
    },
    //width: 80,
   // height: 30,
  },
  valueCellStyle: { // 第二列单元格样式  （选填）
    font: {//字体风格  （选填）
      family: '微软雅黑',//字样  (选填)
      size: 22,//字体大小  (选填)
      color: '0xffffff00',//字体颜色 argb (选填)
      outline: {//轮廓线 (选填)
        width: 0,// 宽度 0 1 2     (选填)
        color: '0xffffffff',//颜色 argb (选填)
      },
    },
    //width: 240,
    //height: 30,
  },
  exitButtonStyle:{//退出按钮样式   （选填）
    offset:{//按钮在列表中的偏移  （选填）
      x:360,//x方向偏移  （选填）
      y:30//y方向偏移  （选填）
    },
    background:{//背景  （选填）
      image:`${labelsUrl}playground/public/teslaImg/exit.png`,//图片地址  （必填）
      color:'0x00000000'//图片颜色 argb   （选填）
    },
    width:32, //图片宽度  （必填）
      height:32  //图片高度  （必填）
  },
  dividerLineStyle:{//分割线样色  （选填）
    color:'0xff000011' //分割线颜色 （选填）
  },   
  width :420,//列表总体宽度  （必填）
  height:280,//列表总体高度   （必填）
  background:{//列表背景   （选填）
    image :`${labelsUrl}playground/public/teslaImg/tesla_listLabel_bg.png`,//列表背景图片地址  （选填）
    color : '0x66ffffff',//背景颜色  （选填）
  },
  labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
  },
  event:{   //点击触发事件 (选填)
    dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
      type:'event',
      content:{
        type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
      }
    },
  },
  content :{ //内容  （必填）
    caption:'${文字}',//标题内容  (支持变量数据在VariableData参数中设置)  （选填）
    dataSource:[  //列表单元格内容  该形式为数组形式 "key"对应的值为 第一列内容  "value"对应的值为 第二列内容   (支持变量数据在VariableData参数中设置) （必填）
    {
        'key':'${1.1}',  //  (支持变量数据在VariableData参数中设置) 
        'value': '${1.2}', //  (支持变量数据在VariableData参数中设置) 
      },
      {
        'key':'${2.1}',  //  (支持变量数据在VariableData参数中设置) 
        'value': '${2.2}',   //  (支持变量数据在VariableData参数中设置) 
      },
      {
        'key':'${3.1}',  //  (支持变量数据在VariableData参数中设置) 
        'value': '${3.2}', //  (支持变量数据在VariableData参数中设置) 
      },
      {
        'key':'${4.1}',   //  (支持变量数据在VariableData参数中设置) 
        'value': '${4.2}',   //  (支持变量数据在VariableData参数中设置) 
      },
      {
        'key':'${5.1}',   //  (支持变量数据在VariableData参数中设置) 
        'value': '${5.2}',   //  (支持变量数据在VariableData参数中设置) 
      },
      {
        'key':'${6.1}',   //  (支持变量数据在VariableData参数中设置) 
        'value': '${6.2}',   //  (支持变量数据在VariableData参数中设置) 
      },
      {
        'key':'${7.1}',   //  (支持变量数据在VariableData参数中设置) 
        'value': '${7.2}',   //  (支持变量数据在VariableData参数中设置) 
      },
    ]
    //dataSource:'${data}' //如果使用变量数据 可以使用该方式  在VariableData参数中进行设置
  }
}
const sceneLabelManager = await cloud.getSceneLabelManager()
const layername = 'new'
const Pos = { x: 0, y: 0, z: 0 }
await sceneLabelManager.addListSceneLabel(layername, Pos,listStyle , frameStyle,variableData)

// 标牌框架
const frameStyle: SceneLabelStyle = {
  bShow: true,//控制显隐 （选填）
  bShowByVisibleRange: false,//显隐根据显示范围控制 （选填）
  bSetScaleByDis : false,//近大远小 （选填）
  visibleInterval://显隐根据可视范围 （选填）
  {
    visibleMin: 0,//相机距离标牌最小距离 （选填）
    visibleMax: 99999999,//相机距离标牌最大距离 （选填）
  },
  wireFrame: {//引线 （选填）
    wireFrameType: 'LightLineWireFrame',//引线类型 'LightLineWireFrame'(发光引线) ,'EmptyWireFrame'(空引线)   （选填）
    dragDirection: 1,//拖拽方向 0（不可拖拽）1（任意方向） 2（x方向） 3（y方向）   （选填）
    lineColor: '0xffffffff',//颜色 仅支持 16 进制argb "0xffffffff"  （选填）
    wireWidth: 3,//1-5适宜  （选填）
    wireEndPointStyle: 4,//引线端点类型 0（控端点） 1（圆形） 2（三角） 3（方形） 4（五星）  （选填）
    offset://引线偏移   （选填）
      [0, //x方向  （选填）
        0],//y方向  （选填）
  },
}
// 用于变量替换的数据
const variableData :VariableData =
{
useLocalData:true,//使用网络数据还是本地数据  true使用'localData'  false使用'urlData'   （选填） 

 // 参考例子中的conwfw,"conwfw"是变量，"wfwfwfewf"是变量对应的值。
// 如果在可使用变量的地方使用变量需要对"conwfw"增加识别符号变成"${conwfw}"。
// 目前可使用变量的地方为TextStyle的content,ImageStyle的content,ListStyle的content,ImageAndTextStyle与SelfDefineStyle的子样式的content。
// TextStyle的content如果值为"${conwfw}",则实际TextStyle的文本内容显示值为wfwfwfewf。
// 列表的变量数据支持对单个单元格的颜色支持,如果某个列表的单元格的值为"${item1-1}",则去找例子中的属性名"item1-1",
// 对应的属性值中"'0xffff0000'"为变量对应的颜色值,34°为变量对应的变量值</p>
// 
// localData:{
// "conwfw"   = "wfwfwfewf";
// "picture"   = "D:\\1.jpeg";
// "item1-1": "<p style=color:'0xffff0000';>34°</p>";
// }
localData:{//本地数据  （选填）
  conwfw: 'hello', //一个例子   （选填）
  data:[    //适用于列表                     
     {
        'key':'1.1',  
        'value': '1.2', 
      },
      {
        'key':'2.1',  
        'value': '2.2',    
      },
    ],
},
//请求url地址后会返回json类型的字符串，如下:
//{
 //    "conwfw"   = "wfwfwfewf";
 //    "picture"   = "D:\\1.jpeg";
 //    }

urlData:{//网络数据  （选填）
  alwaysRefresh :true,//是否持续请求url地址 true 持续请求  false 仅请求一次  （选填）
  refreshInterval :1,//持续请求间隔 单位s   （选填）
  url:'192.168.0.196:8089/mock/random?group=ddfa6a3a26964bd6b0dd622dc71ab8c9',  //url地址  请求内容格式为json  详细描述见url  （选填）
  method:'get' // 固定值 get请求获取  （必填）
}
}

// 列表标牌的样式
const listStyle : ListStyle = 
{
  type:'List',  //'List'为列表标识  (必填)
  style:{   //列表样式  (选填)
    page: {  //翻页 (选填)
    position: 1,  //翻页位置  总体居上 0 居左 1 居中 2居右  (选填)
    prevStyle: { //上翻页按钮  (必填)
      background:{ //背景 (必填)
        color:'0xffffffff', //按钮颜色 argb   (选填)
        image:`${labelsUrl}playground/public/teslaImg/pageup.png`, //图片地址 (必填)
      },
      width: 32,//图片宽  (必填)
      height: 32,//图片高  (必填)
    },
    nextStyle: {  //下翻页按钮 (必填)
      background:{ //背景 (必填)
        color:'0xffffffff',//按钮颜色 argb (选填)
        image:`${labelsUrl}playground/public/teslaImg/pagedown.png`,//图片地址 (必填)
      }, 
      width: 32,//图片宽  (必填)
      height: 32,//图片高  (必填)
    },
    showPageStyle:{//显示页数的标签样式  （选填）
      font:{
       color:"0xffffff55",//字体颜色
       family:"宋体",//字体种类
       size:30//字体大小
      }
    }
  },
  captionStyle: { //标题  （选填）
    position: 1, //翻页位置 总体居下 0 居左 1 居中 2居右  （选填）
    font: {  //字体风格  （选填）
      family: '微软雅黑',//字样  (选填)  
      size: 26,//字体大小  (选填)
      color: '0xffffffff',//字体颜色 argb (选填)
      outline: {//轮廓线 (选填)
        width: 1,// 宽度 0 1 2     (选填)
        color: '0xffffffff',//颜色 argb (选填)
      },
    },
    width: 200,//标题宽度 （必填）
    height: 80,//标题高度  （必填）
  },
  bodyStyle:{ //列表内容 单元格的总体样式  （选填）
    width:150, // 每个单元格的宽度  （选填）
    height:30 //每个单元格的高度     （选填）
  },
  keyCellStyle: { // 第一列单元格样式   （选填）
    font: {//字体风格   （选填）
      family: '微软雅黑',//字样  (选填)
      size: 24,//字体大小  (选填)
      color: '0xffff0000',//字体颜色 argb (选填)
      outline: {//轮廓线 (选填)
        width: 0,// 宽度 0 1 2     (选填)
        color: '0xffffffff',//颜色 argb (选填)
      },
    },
    //width: 80,
   // height: 30,
  },
  valueCellStyle: { // 第二列单元格样式  （选填）
    font: {//字体风格  （选填）
      family: '微软雅黑',//字样  (选填)
      size: 22,//字体大小  (选填)
      color: '0xffffff00',//字体颜色 argb (选填)
      outline: {//轮廓线 (选填)
        width: 0,// 宽度 0 1 2     (选填)
        color: '0xffffffff',//颜色 argb (选填)
      },
    },
    //width: 240,
    //height: 30,
  },
  exitButtonStyle:{//退出按钮样式   （选填）
    offset:{//按钮在列表中的偏移  （选填）
      x:360,//x方向偏移  （选填）
      y:30//y方向偏移  （选填）
    },
    background:{//背景  （选填）
      image:`${labelsUrl}playground/public/teslaImg/exit.png`,//图片地址  （必填）
      color:'0x00000000'//图片颜色 argb   （选填）
    },
    width:32, //图片宽度  （必填）
      height:32  //图片高度  （必填）
  },
  dividerLineStyle:{//分割线样色  （选填）
    color:'0xff000011' //分割线颜色 （选填）
  },   
  width :420,//列表总体宽度  （必填）
  height:280,//列表总体高度   （必填）
  background:{//列表背景   （选填）
    image :`${labelsUrl}playground/public/teslaImg/tesla_listLabel_bg.png`,//列表背景图片地址  （选填）
    color : '0x66ffffff',//背景颜色  （选填）
  },
  labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
  },
  event:{   //点击触发事件 (选填)
    dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
      type:'event',
      content:{
        type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
      }
    },
  },
  content :{ //内容  （必填）
    caption:'${文字}',//标题内容  (支持变量数据在VariableData参数中设置)  （选填）
    dataSource:[  //列表单元格内容  该形式为数组形式 "key"对应的值为 第一列内容  "value"对应的值为 第二列内容   (支持变量数据在VariableData参数中设置) （必填）
    {
        'key':'${1.1}',  //  (支持变量数据在VariableData参数中设置) 
        'value': '${1.2}', //  (支持变量数据在VariableData参数中设置) 
      },
      {
        'key':'${2.1}',  //  (支持变量数据在VariableData参数中设置) 
        'value': '${2.2}',   //  (支持变量数据在VariableData参数中设置) 
      },
      {
        'key':'${3.1}',  //  (支持变量数据在VariableData参数中设置) 
        'value': '${3.2}', //  (支持变量数据在VariableData参数中设置) 
      },
      {
        'key':'${4.1}',   //  (支持变量数据在VariableData参数中设置) 
        'value': '${4.2}',   //  (支持变量数据在VariableData参数中设置) 
      },
      {
        'key':'${5.1}',   //  (支持变量数据在VariableData参数中设置) 
        'value': '${5.2}',   //  (支持变量数据在VariableData参数中设置) 
      },
      {
        'key':'${6.1}',   //  (支持变量数据在VariableData参数中设置) 
        'value': '${6.2}',   //  (支持变量数据在VariableData参数中设置) 
      },
      {
        'key':'${7.1}',   //  (支持变量数据在VariableData参数中设置) 
        'value': '${7.2}',   //  (支持变量数据在VariableData参数中设置) 
      },
    ]
    //dataSource:'${data}' //如果使用变量数据 可以使用该方式  在VariableData参数中进行设置
  }
}
const sceneLabelManager = await cloud.getSceneLabelManager()
const layername = 'new'
const Pos = { x: 0, y: 0, z: 0 }
await sceneLabelManager.addListSceneLabel(layername, Pos,listStyle , frameStyle,variableData)

const frameStyle: SceneLabelStyle = {
   bShow: true,//控制显隐
   bShowByVisibleRange: false,//显隐根据显示范围控制
   visibleInterval:
   {
     visibleMin: 0,//最小距离
     visibleMax: 99999999,//最大距离
   },
   wireFrame: {//引线
     wireFrameType: 'LightLineWireFrame',//引线类型
     dragDirection: 1,//拖拽方向
     lineColor: '0xffffffff',//颜色
     wireWidth: 3,//线宽
     wireEndPointStyle: 4,//引线端点类型
     offset://引线偏移
       [0,
         0],
   },
 }

var htmlStyle :HtmlStyle =
{
   type: 'Html',//网页
   content: 'https://www.douyu.com/',//网址
   style:{
     labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
     background:{
       color:"0xffffffff"//背景颜色
     },
     width:400,//网页宽
     height:300,//网页高
   },
   event:{   //点击触发事件 (选填)
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
       type:'event',
       content:{
         type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
       }
     },
   },
}
 const sceneLabelManager = await cloud.getSceneLabelManager()
 const layername = 'new'
 const Pos = { x: 0, y: 0, z: 0 }
 await sceneLabelManager.addHtmlSceneLabel(layername, Pos,htmlStyle , frameStyle,variableData)

const frameStyle: SceneLabelStyle = {
   bShow: true,//控制显隐
   bShowByVisibleRange: false,//显隐根据显示范围控制
   visibleInterval:
   {
     visibleMin: 0,//最小距离
     visibleMax: 99999999,//最大距离
   },
   wireFrame: {//引线
     wireFrameType: 'LightLineWireFrame',//引线类型
     dragDirection: 1,//拖拽方向
     lineColor: '0xffffffff',//颜色
     wireWidth: 3,//线宽
     wireEndPointStyle: 4,//引线端点类型
     offset://引线偏移
       [0,
         0],
   },
 }

var htmlStyle :HtmlStyle =
{
   type: 'Html',//网页
   content: 'https://www.douyu.com/',//网址
   style:{
     labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
     background:{
       color:"0xffffffff"//背景颜色
     },
     width:400,//网页宽
     height:300,//网页高
   },
   event:{   //点击触发事件 (选填)
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
       type:'event',
       content:{
         type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
       }
     },
   },
}
 const sceneLabelManager = await cloud.getSceneLabelManager()
 const layername = 'new'
 const Pos = { x: 0, y: 0, z: 0 }
 await sceneLabelManager.addHtmlSceneLabel(layername, Pos,htmlStyle , frameStyle,variableData)

// 标牌框架
const frameStyle: SceneLabelStyle = {
   bShow: true,//控制显隐 （选填）
   bShowByVisibleRange: false,//显隐根据显示范围控制 （选填）
   bSetScaleByDis : false,//近大远小 （选填）
   visibleInterval://显隐根据可视范围 （选填）
   {
     visibleMin: 0,//相机距离标牌最小距离 （选填）
     visibleMax: 99999999,//相机距离标牌最大距离 （选填）
   },
   wireFrame: {//引线 （选填）
     wireFrameType: 'LightLineWireFrame',//引线类型 'LightLineWireFrame'(发光引线) ,'EmptyWireFrame'(空引线)   （选填）
     dragDirection: 1,//拖拽方向 0（不可拖拽）1（任意方向） 2（x方向） 3（y方向）   （选填）
     lineColor: '0xffffffff',//颜色 仅支持 16 进制argb "0xffffffff"  （选填）
     wireWidth: 3,//1-5适宜  （选填）
     wireEndPointStyle: 4,//引线端点类型 0（控端点） 1（圆形） 2（三角） 3（方形） 4（五星）  （选填）
     offset://引线偏移   （选填）
       [0, //x方向  （选填）
         0],//y方向  （选填）
   },
 }

// 用于变量替换的数据
const variableData :VariableData =
{
 useLocalData:true,//使用网络数据还是本地数据  true使用'localData'  false使用'urlData'   （选填） 

  // 参考例子中的conwfw,"conwfw"是变量，"wfwfwfewf"是变量对应的值。
 // 如果在可使用变量的地方使用变量需要对"conwfw"增加识别符号变成"${conwfw}"。
 // 目前可使用变量的地方为TextStyle的content,ImageStyle的content,ListStyle的content,ImageAndTextStyle与SelfDefineStyle的子样式的content。
 // TextStyle的content如果值为"${conwfw}",则实际TextStyle的文本内容显示值为wfwfwfewf。
 // 列表的变量数据支持对单个单元格的颜色支持,如果某个列表的单元格的值为"${item1-1}",则去找例子中的属性名"item1-1",
 // 对应的属性值中"'0xffff0000'"为变量对应的颜色值,34°为变量对应的变量值</p>
 // 
 // localData:{
 // "conwfw"   = "wfwfwfewf";
 // "picture"   = "D:\\1.jpeg";
 // "item1-1": "<p style=color:'0xffff0000';>34°</p>";
 // }
 localData:{//本地数据  （选填）
   文字: 'hello', //一个例子   （选填）
   picture : "D:\\1.jpeg",//一个例子   （选填）
   data:[    //适用于列表                     
      {
         'key':'1.1',  
         'value': '1.2', 
       },
       {
         'key':'2.1',  
         'value': '2.2',    
       },
     ],
 },
 //请求url地址后会返回json类型的字符串，如下:
 //{
  //    "conwfw"   = "wfwfwfewf";
  //    "picture"   = "D:\\1.jpeg";
  //    }

 urlData:{//网络数据  （选填）
   alwaysRefresh :true,//是否持续请求url地址 true 持续请求  false 仅请求一次  （选填）
   refreshInterval :1,//持续请求间隔 单位s   （选填）
   url:'192.168.0.196:8089/mock/random?group=ddfa6a3a26964bd6b0dd622dc71ab8c9',  //url地址  请求内容格式为json  详细描述见url  （选填）
   method:'get' // 固定值 get请求获取  （必填）
 }
}

// 文字标牌的样式
const textStyle :TextStyle = 
{
   type: 'Text' , //'Text'为文字样式标识  (必填)
   content: '${文字}', //文字内容  (必填) (支持变量数据在VariableData参数中设置)
   style:{ //风格    (选填)
     labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
     font:{ //字体风格  (选填)
       family:'微软雅黑',//字样  (选填)
       size:26, //字体大小  (选填)
       color:'0xff00FFB1', //字体颜色 argb (选填)
       outline:{//轮廓线 (选填)
         color:'0xff00FFF3',//颜色 argb (选填)
         width:0// 宽度 0 1 2     (选填)
       }
     },
     border:{ //边框属性  (选填)
       color:'0xffffffff'//边框颜色 argb (选填)
     }, 
     background:{//背景  (选填)
       color:"0x330000ff"//背景色 argb  (选填)
     }
   },
   event:{   //点击触发事件 (选填)
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
       type:'event',
       content:{
         type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
       }
     },
   }
}

// 图片标牌的样式
const imageStyle:ImageStyle=
{
   type: 'Image',  //'Text'为文字样式标识  (必填)
   //content: '${picture}',  //图片地址 (必填)
   content: 'D:/clock.png', //图片路径(必填) 支持本地路径和网络路径   支持apng动图格式   (支持变量数据在VariableData参数中设置)
   style:{     //风格    (选填)
     labelPos :0, //原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
     background:{ //背景  (选填)
       color:"0x66ffffff"  //背景色 argb  (选填)
     },
     width:300, //图片宽 (选填)
     height:200  //图片高  (选填)
   },
   event:{   //点击触发事件 (选填)
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
       type:'event',
       content:{
         type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
       }
     },
   }
} 

// 按钮标牌的样式
const pushbuttonStyle :ButtonStyle=
{
   type:'Pushbutton',  //'Pushbutton'为按钮标识  (必填)
   content:`${labelsUrl}playground/public/teslaImg/tesla_log.png`,  //图片地址 (必填) 支持本地地址与网络地址 不支持变量数据
   style:{//风格    (选填)
     labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
     background:{//背景  (选填)
       color:"0x66ff00ff" //背景色 argb  (选填)
     },
     model:2,//按钮形态  1 （没有按钮弹起效果） 2 （有弹起效果）  (选填)
     width:100,  // 按钮宽度   (必填)
     height:30    //按钮高度   (必填)
   },
   event:{   //点击触发事件 (选填)
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息  (选填)
       type:'event',
       content:{
         type:'LabelDbClickFinish',
       }
     },
   }
}

// 列表标牌的样式
const listStyle : ListStyle = 
{
   type:'List',  //'List'为列表标识  (必填)
   style:{   //列表样式  (选填)
     page: {  //翻页 (选填)
     position: 1,  //翻页位置  总体居上 0 居左 1 居中 2居右  (选填)
     prevStyle: { //上翻页按钮  (必填)
       background:{ //背景 (必填)
         color:'0xffffffff', //按钮颜色 argb   (选填)
         image:`${labelsUrl}playground/public/teslaImg/pageup.png`, //图片地址 (必填)
       },
       width: 32,//图片宽  (必填)
       height: 32,//图片高  (必填)
     },
     nextStyle: {  //下翻页按钮 (必填)
       background:{ //背景 (必填)
         color:'0xffffffff',//按钮颜色 argb (选填)
         image:`${labelsUrl}playground/public/teslaImg/pagedown.png`,//图片地址 (必填)
       }, 
       width: 32,//图片宽  (必填)
       height: 32,//图片高  (必填)
     },
     showPageStyle:{//显示页数的标签样式  （选填）
      font:{
        color:"0xffffff55",//字体颜色
        family:"宋体",//字体种类
        size:30//字体大小
       }
     }
   },
   captionStyle: { //标题  （选填）
     position: 1, //翻页位置 总体居下 0 居左 1 居中 2居右  （选填）
     font: {  //字体风格  （选填）
       family: '微软雅黑',//字样  (选填)  
       size: 26,//字体大小  (选填)
       color: '0xffffffff',//字体颜色 argb (选填)
       outline: {//轮廓线 (选填)
         width: 1,// 宽度 0 1 2     (选填)
         color: '0xffffffff',//颜色 argb (选填)
       },
     },
     width: 200,//标题宽度 （必填）
     height: 80,//标题高度  （必填）
   },
   bodyStyle:{ //列表内容 单元格的总体样式  （选填）
     width:150, // 每个单元格的宽度  （选填）
     height:30 //每个单元格的高度     （选填）
   },
   keyCellStyle: { // 第一列单元格样式   （选填）
     font: {//字体风格   （选填）
       family: '微软雅黑',//字样  (选填)
       size: 24,//字体大小  (选填)
       color: '0xffff0000',//字体颜色 argb (选填)
       outline: {//轮廓线 (选填)
         width: 0,// 宽度 0 1 2     (选填)
         color: '0xffffffff',//颜色 argb (选填)
       },
     },
     //width: 80,
    // height: 30,
   },
   valueCellStyle: { // 第二列单元格样式  （选填）
     font: {//字体风格  （选填）
       family: '微软雅黑',//字样  (选填)
       size: 22,//字体大小  (选填)
       color: '0xffffff00',//字体颜色 argb (选填)
       outline: {//轮廓线 (选填)
         width: 0,// 宽度 0 1 2     (选填)
         color: '0xffffffff',//颜色 argb (选填)
       },
     },
     //width: 240,
     //height: 30,
   },
   exitButtonStyle:{//退出按钮样式   （选填）
     offset:{//按钮在列表中的偏移  （选填）
       x:360,//x方向偏移  （选填）
       y:30//y方向偏移  （选填）
     },
     background:{//背景  （选填）
       image:`${labelsUrl}playground/public/teslaImg/exit.png`,//图片地址  （必填）
       color:'0x00000000'//图片颜色 argb   （选填）
     },
     width:32, //图片宽度  （必填）
       height:32  //图片高度  （必填）
   },
   dividerLineStyle:{//分割线样色  （选填）
     color:'0xff000011' //分割线颜色 （选填）
   },   
   width :420,//列表总体宽度  （必填）
   height:280,//列表总体高度   （必填）
   background:{//列表背景   （选填）
     image :`${labelsUrl}playground/public/teslaImg/tesla_listLabel_bg.png`,//列表背景图片地址  （选填）
     color : '0x66ffffff',//背景颜色  （选填）
   },
   labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
   },
   event:{   //点击触发事件 (选填)
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
       type:'event',
       content:{
         type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
       }
     },
   },
   content :{ //内容  （必填）
     caption:'${文字}',//标题内容    （选填）
     dataSource:[  //列表单元格内容  该形式为数组形式 "key"对应的值为 第一列内容  "value"对应的值为 第二列内容   (支持变量数据在VariableData参数中设置) （必填）
     {
         'key':'${1.1}',//  (支持变量数据在VariableData参数中设置)   
         'value': '${1.2}',//  (支持变量数据在VariableData参数中设置) 
       },
       {
         'key':'${2.1}',//  (支持变量数据在VariableData参数中设置) 
         'value': '${2.2}',//  (支持变量数据在VariableData参数中设置) 
       },
       {
         'key':'${3.1}',//  (支持变量数据在VariableData参数中设置) 
         'value': '${3.2}',//  (支持变量数据在VariableData参数中设置) 
       },
       {
         'key':'${4.1}',//  (支持变量数据在VariableData参数中设置) 
         'value': '${4.2}',//  (支持变量数据在VariableData参数中设置) 
       },
       {
         'key':'${5.1}',//  (支持变量数据在VariableData参数中设置) 
         'value': '${5.2}',//  (支持变量数据在VariableData参数中设置) 
       },
       {
         'key':'${6.1}',//  (支持变量数据在VariableData参数中设置) 
         'value': '${6.2}',//  (支持变量数据在VariableData参数中设置) 
       },
       {
         'key':'${7.1}',//  (支持变量数据在VariableData参数中设置) 
         'value': '${7.2}',//  (支持变量数据在VariableData参数中设置) 
       },
     ]
     //dataSource:'${data}' //如果使用变量数据 可以使用该方式  在VariableData参数中进行设置
   }
}

//  网页标牌的样式
// const htmlStyle :HtmlStyle =
// {
//     type: 'Html',
//     content: 'https://www.douyu.com/',
//     style:{
//       labelPos :0,
//       background:{
//         color:"0xffffffff"
//       },
//       width:400,
//       height:300,
//     }
// }

// 文字加图片标牌的样式
const imageAndTextStyle :ImageAndTextStyle ={
 type: 'ImageAndText', //'ImageAndText'指图片加文字标识   （必填）
 content: [textStyle,imageStyle],  //textStyle文本风格接口,imageStyle图片风格接口 （必填）
 style:{ //风格   
   labelPos:0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
   textToImagePos:2//文字相对图片的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
 },
 event:{   //点击触发事件 (选填)
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
       type:'event',
       content:{
         type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
       }
     },
   },
}
//适合自定义标牌的文本样式
const textStyleEx :TextStyle = 
{
   type: 'Text' , //'Text'为文字样式标识  (必填)
   content: '${文字}', //文字内容  (必填) (支持变量数据在VariableData参数中设置)
   style:{ //风格    (选填)
     labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
     font:{ //字体风格  (选填)
       family:'微软雅黑',//字样  (选填)
       size:26, //字体大小  (选填)
       color:'0xff00FFB1', //字体颜色 argb (选填)
       outline:{//轮廓线 (选填)
         color:'0xff00FFF3',//颜色 argb (选填)
         width:0// 宽度 0 1 2     (选填)
       }
     },
     border:{ //边框属性  (选填)
       color:'0xffffffff'//边框颜色 argb (选填)
     }, 
     background:{//背景  (选填)
       color:"0x330000ff"//背景色 argb  (选填)
     },
     zIndex : 5,  //显示优先级  越大越优先 (必填)
     offset:{ //该样式在自定义标牌中的偏移值 (选填)
       x:170,  //x方向偏移
       y:-26,  //y方向偏移
     }
   },
   event:{   //点击触发事件 (选填)
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
       type:'event',
       content:{
         type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
       }
     },
   },
   id:1  //用于自定义标牌  标识该样式对应id int类型范围建议1-1000  (必填)
}
//适合自定义标牌的图片样式
const imageStyleEx:ImageStyle=
{
   type: 'Image',  //'Text'为文字样式标识  (必填)
   content: `${labelsUrl}playground/public/teslaImg/tesla_info.png`,  //图片路径(必填) 支持本地路径和网络路径   支持apng动图格式  (支持变量数据在VariableData参数中设置)
   //content: 'D:/clock.png',
   style:{     //风格    (选填)
     labelPos :0, //原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
     background:{ //背景  (选填)
       color:"0x66ffffff"  //背景色 argb  (选填)
     },
     zIndex:4, //显示优先级  越大越优先 (必填)
     offset:{ //该样式在自定义标牌中的偏移值 (选填)
       x:0,//x方向偏移
       y:0, //y方向偏移
     },
     width:420, //图片宽 (选填)
     height:80  //图片高  (选填)
   },
   event:{   //点击触发事件 (选填)
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
       type:'event',
       content:{
         type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
       }
     },
   },
   id:2,//用于自定义标牌  标识该样式对应id int类型范围建议1-1000  (必填)
} 

//适合自定义标牌的按钮样式
const pushbuttonStyleEx :ButtonStyle=
{
   type:'Pushbutton',  //'Pushbutton'为按钮标识  (必填)
   content:`${labelsUrl}playground/public/teslaImg/tesla_log.png`,  //图片地址 (必填) 支持本地地址与网络地址
   style:{//风格    (选填)
     labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
     background:{//背景  (选填)
       color:"0x66ff00ff" //背景色 argb  (选填)
     },
     model:2,//按钮形态  1 （没有按钮弹起效果） 2 （有弹起效果）  (选填)
     width:100,  // 按钮宽度   (必填)
     height:30,    //按钮高度   (必填)
     zIndex:5,//显示优先级  越大越优先  (必填)
     offset:{//该样式在自定义标牌中的偏移值 (选填)
       x:420-64,//x方向偏移    (选填)
       y:0,//y方向偏移  (选填)
     },
   },
   id:3,//用于自定义标牌  标识该样式对应id int类型范围建议1-1000  (必填)
   event:{   //点击触发事件 (选填)  
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息  (选填)
       type:'event',
       content:{
         type:'LabelDbClickFinish',
       }
     },
   }
}

//  适合自定义标牌的列表样式
const listStyleEx : ListStyle = 
{
   type:'List',  //'List'为列表标识  (必填)
   style:{   //列表样式  (选填)
     page: {  //翻页 (选填)
     position: 1,  //翻页位置  总体居上 0 居左 1 居中 2居右  (选填)
     prevStyle: { //上翻页按钮  (必填)
       background:{ //背景 (必填)
         color:'0xffffffff', //按钮颜色 argb   (选填)
         image:`${labelsUrl}playground/public/teslaImg/pageup.png`, //图片地址 (必填)
       },
       width: 32,//图片宽  (必填)
       height: 32,//图片高  (必填)
     },
     nextStyle: {  //下翻页按钮 (必填)
       background:{ //背景 (必填)
         color:'0xffffffff',//按钮颜色 argb (选填)
         image:`${labelsUrl}playground/public/teslaImg/pagedown.png`,//图片地址 (必填)
       }, 
       width: 32,//图片宽  (必填)
       height: 32,//图片高  (必填)
     },
     showPageStyle:{//显示页数的标签样式  （选填）
       font:{
        color:"0xffffff55",//字体颜色
        family:"宋体",//字体种类
        size:30//字体大小
       }
     }
   },
   captionStyle: { //标题  （选填）
     position: 1, //翻页位置 总体居下 0 居左 1 居中 2居右  （选填）
     font: {  //字体风格  （选填）
       family: '微软雅黑',//字样  (选填)  
       size: 26,//字体大小  (选填)
       color: '0xffffffff',//字体颜色 argb (选填)
       outline: {//轮廓线 (选填)
         width: 1,// 宽度 0 1 2     (选填)
         color: '0xffffffff',//颜色 argb (选填)
       },
     },
     width: 200,//标题宽度 （必填）
     height: 80,//标题高度  （必填）
   },
   bodyStyle:{ //列表内容 单元格的总体样式  （选填）
     width:150, // 每个单元格的宽度  （选填）
     height:30 //每个单元格的高度     （选填）
   },
   keyCellStyle: { // 第一列单元格样式   （选填）
     font: {//字体风格   （选填）
       family: '微软雅黑',//字样  (选填)
       size: 24,//字体大小  (选填)
       color: '0xffff0000',//字体颜色 argb (选填)
       outline: {//轮廓线 (选填)
         width: 0,// 宽度 0 1 2     (选填)
         color: '0xffffffff',//颜色 argb (选填)
       },
     },
     //width: 80,
    // height: 30,
   },
   valueCellStyle: { // 第二列单元格样式  （选填）
     font: {//字体风格  （选填）
       family: '微软雅黑',//字样  (选填)
       size: 22,//字体大小  (选填)
       color: '0xffffff00',//字体颜色 argb (选填)
       outline: {//轮廓线 (选填)
         width: 0,// 宽度 0 1 2     (选填)
         color: '0xffffffff',//颜色 argb (选填)
       },
     },
     //width: 240,
     //height: 30,
   },
   exitButtonStyle:{//退出按钮样式   （选填）
     offset:{//按钮在列表中的偏移  （选填）
       x:360,//x方向偏移  （选填）
       y:30//y方向偏移  （选填）
     },
     background:{//背景  （选填）
       image:`${labelsUrl}playground/public/teslaImg/exit.png`,//图片地址  （必填）
       color:'0x00000000'//图片颜色 argb   （选填）
     },
     width:32, //图片宽度  （必填）
       height:32  //图片高度  （必填）
   },
   dividerLineStyle:{//分割线样色  （选填）
     color:'0xff000011' //分割线颜色 （选填）
   },   
   width :420,//列表总体宽度  （必填）
   height:280,//列表总体高度   （必填）
   background:{//列表背景   （选填）
     image :`${labelsUrl}playground/public/teslaImg/tesla_listLabel_bg.png`,//列表背景图片地址  （选填）
     color : '0x66ffffff',//背景颜色  （选填）
   },
   labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
   zIndex:2,//显示优先级  越大越优先  (必填)
     offset:{//该样式在自定义标牌中的偏移值 (选填)
       x:0,//x方向偏移    (选填)
       y:0,//y方向偏移  (选填)
     },
   },
   event:{   //点击触发事件 (选填)
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
       type:'event',
       content:{
         type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
       }
     },
   },
   content :{ //内容  （必填）
     caption:'${文字}',//标题内容    （选填）
     dataSource:[  //列表单元格内容  该形式为数组形式 "key"对应的值为 第一列内容  "value"对应的值为 第二列内容   (支持变量数据在VariableData参数中设置) （必填）
     {
         'key':'${1.1}',//  (支持变量数据在VariableData参数中设置) 
         'value': '${1.2}',//  (支持变量数据在VariableData参数中设置) 
       },
       {
         'key':'${2.1}',//  (支持变量数据在VariableData参数中设置) 
         'value': '${2.2}',//  (支持变量数据在VariableData参数中设置) 
       },
       {
         'key':'${3.1}',//  (支持变量数据在VariableData参数中设置) 
         'value': '${3.2}',//  (支持变量数据在VariableData参数中设置) 
       },
       {
         'key':'${4.1}',//  (支持变量数据在VariableData参数中设置) 
         'value': '${4.2}',//  (支持变量数据在VariableData参数中设置) 
       },
       {
         'key':'${5.1}',//  (支持变量数据在VariableData参数中设置) 
         'value': '${5.2}',//  (支持变量数据在VariableData参数中设置) 
       },
       {
         'key':'${6.1}',//  (支持变量数据在VariableData参数中设置) 
         'value': '${6.2}',//  (支持变量数据在VariableData参数中设置) 
       },
       {
         'key':'${7.1}',//  (支持变量数据在VariableData参数中设置) 
         'value': '${7.2}',//  (支持变量数据在VariableData参数中设置) 
       },
     ]
     //dataSource:'${data}'//如果使用变量数据 可以使用该方式  在VariableData参数中进行设置
   },
   id:4,//用于自定义标牌  标识该样式对应id int类型范围建议1-1000  (必填)
}

//  自定义标牌的样式
const selfDefineStyle :SelfDefineStyle=
{
  type:'SelfDefine', // 'SelfDefine'自定义标牌样式的标识 (必填)
  content:[ //内容数组   (必填)
  listStyleEx,  //列表样式  (选填)
  textStyleEx,  //文本样式  (选填)
  imageStyleEx, //图片样式  (选填)
  pushbuttonStyleEx,  //按钮样式  (选填)
  ],
  style:{  //自定义样式 (必填)
   labelPos :0,//原点相对标牌的位置  (选填) 0中心 1左上 2中上 3右上 4右中 5右下 6中下 7左下 8中左
     background:{//背景   (选填)
       color:"0x66ffffff", //背景颜色   (选填)
       image :`${labelsUrl}playground/public/teslaImg/tesla_bg.png`,//背景图片   (必填)
     },
     width:420, //自定义标牌的宽   (必填)
     height:360, //自定义标牌的高   (必填)
  },
  event:{   //点击触发事件 (选填)
     dblclick:{ //双击事件  内容自己定义 一般为后端向前端传送的json信息 用于触发回调 （前提是已经设置回调函数） (选填)  
       type:'event',
       content:{
         type:'LabelDbClickFinish',  //此例子会触发标牌的双击回调  但是向前端发送的数据是空数据
       }
     },
   },
}
const textLabel : TextLabel= //文字标牌
 {
   localPos:{ //标牌局部坐标 (必填)
     x :0,
     y:0,
     z:0,
    },
    guid:'fwegwefwefkwelfwelf',  //唯一标识 (必填)
    labelFrame:frameStyle,  //标牌框架  (选填)
    content:textStyle,  //内容框架  (必填)
    variableData:variableData,  //变量数据 (选填)
 }
 const imageLabel : ImageLabel=
 {
   localPos:{ //标牌局部坐标 (必填)
     x : 10,
     y : 0,
     z : 0,
    },
    guid:'kwgpwgefwefhwhewe', //唯一标识  (选填)
    labelFrame:frameStyle,  //标牌框架 (选填) 
    content:imageStyle,  //内容框架  (选填)
    variableData:variableData, //变量数据 (选填)
 }
 const buttonLabel : ButtonLabel=
 {
   localPos:{//标牌局部坐标   (必填)
     x : 0,
     y : 10,
     z : 0,
    },
    guid:'gnwprgnergnwpjfwe',//唯一标识  (必填)
    labelFrame:frameStyle,//标牌框架   (选填)
    content:pushbuttonStyle, //内容框架  (选填)
 }
 const  listLabel : ListLabel=
 {
   localPos:{  //标牌局部坐标   (必填)
     x : 0,
     y : 0,
     z : 10,
    },
    guid:'pwkweogwegw', //唯一标识  (必填)
    labelFrame:frameStyle,  //标牌框架   (选填)
    content:listStyle,  //内容框架 (必填)
    variableData:variableData, //变量数据 (选填)
 }
 const imageAndTextLabel : ImageAndTextLabel=
 {
   localPos:{//标牌局部坐标   (必填)
     x : -10,
     y : 0,
     z : 0,
    },
    guid:'wfwefwefwefwfgdf',  //唯一标识  (必填)
    labelFrame:frameStyle,   //标牌框架   (选填)
    content: imageAndTextStyle, //内容框架  (必填)
    variableData:variableData,  //变量数据 (选填)
 }
 const selfDefineLabel: SelfDefineLabel=
 {
   localPos:{//标牌局部坐标   (必填)
     x : 0,
     y : -10,
     z : 0,
    },
    guid:'kgerjgoepjge',  //唯一标识  (必填)
    labelFrame:frameStyle,  //标牌框架   (选填)
    content: selfDefineStyle,  //内容框架  (必填)
    variableData:variableData, //变量数据 (选填)
 }

 const batchParam : BatchLabelParam =
 {
   layerName : "new",  //图层名称
   labels:[    //标牌数组 
   textLabel,     //文字标牌(可选)
   imageLabel,   //图片标牌 (可选)
   buttonLabel,  //按钮标牌 (可选)
   listLabel,  //列表标牌 (可选)
   imageAndTextLabel,  //文字加图片标牌 (可选)
   selfDefineLabel  //自定义标牌 (可选)
   ]
 }
 const sceneLabelManager = await cloud.getSceneLabelManager()
 await sceneLabelManager.addLayerForJson(batchParam)