Skip to content

气泡图操作 ​

目录 ​

1. 添加气泡图 ​

引入版本:3.0 起支持

功能描述 ​

在三维场景中添加气泡图

调用方法 ​

JavaScript
let jsonData = {
  id: 'bubble',
  name: '气泡图层',
  coordType: 0,
  coordTypeZ: 0,
  fillArea: 'none',
  speed: 10,
  radiusMax: 300,
  radiusMin: 20,
  valueMax: 800,
  valueMin: 50,
  visible: true,
  legends: [
    {
      name: 'legend01',
      color: '#ff0000',
    },
    {
      name: 'legend02',
      color: '#ffff00',
    },
    {
      name: 'legend03',
      color: '#0000FF',
    },
    {
      name: 'legend04',
      color: '#00B200',
    },
    {
      name: 'legend05',
      color: '#FF26FF',
    },
  ],
  data: [
    {
      id: '1',
      coord: [113.93835736961601, 22.5119561475007], //以深圳湾经纬度为例
      value: 1000,
      type: 'legend01',
      coordZ: 64,
    },
    {
      id: '2',
      coord: [113.93657896176401, 22.5118007468059],
      value: 800,
      type: 'legend02',
      coordZ: 64,
    },
    {
      id: '3',
      coord: [113.934800475827, 22.5108922516106],
      value: 650,
      type: 'legend03',
      coordZ: 64,
    },
    {
      id: '4',
      coord: [113.93981427565701, 22.5101691717282],
      value: 480,
      type: 'legend04',
      coordZ: 64,
    },
    {
      id: '5',
      coord: [113.93555050942001, 22.510038825398098],
      value: 380,
      type: 'legend05',
      coordZ: 64,
    },
  ],
};

appInstance.uniCall('addBubbleLayer', jsonData, (result) => {
  console.result(result);
});

参数描述 ​

属性类型说明
idString图层对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别
nameString图层名称,支持为图层自定义名称
coordTypeNumberXY 轴坐标类别,0:X 经度,Y 纬度;1:X 米,Y 米,相对世界 00 点
coordTypeZNumberZ 轴坐标类别,0:相对 3D 世界 0 海拔;1:相对 3D 世界地表;2:相对 3D 模型表面(单位:米)
fillAreaString区域填充样式类别
speedNumber气泡扩散速度(单位:米/秒)
radiusMaxNumber气泡最大半径(单位:米)
radiusMinNumber气泡最小半径(单位:米)色
valueMaxNumber最大值上限
valueMinNumber最小值下限
visibleBoolean添加当前图层时默认显示还是隐藏
legendsArray定义图层包含图例,支持为不同图例定义各自样式
legends[0].nameString图层内图例名称,新建时调用者自己传入的唯一名称,用于各种操作的图例识别
legends[0].colorString颜色(HEX 颜色值)
dataArray定义图层可视化数据
data[0].idString图层子对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别
data[0].coordArrayXY 轴坐标,X:经度;Y:纬度
data[0].coordZNumberZ 轴高度(单位:米)
data[0].valueNumber数据点权值
data[0].typeString数据点图例类别

回调数据 ​

JSON
{
  "result": 1,
  "message": "成功。"
}

回调数据参数描述 ​

属性类型说明
resultNumber1:代表成功;0:代表失败
messageString成功或者失败原因

返回本章目录

2. 更新气泡图数据 ​

引入版本:3.0 起支持

功能描述 ​

更新三维场景中添加气泡图的数据

调用方法 ​

JavaScript
let jsonData = {
  id: 'bubble',
  name: '气泡图层',
  coordType: 0,
  coordTypeZ: 0,
  isAppend: true,
  data: [
    {
      id: '8',
      coord: [113.88432864733, 22.494656463200702], //以深圳湾经纬度为例
      value: 20,
      coordZ: 64,
      type: 'legend01',
    },
    {
      id: '9',
      coord: [113.88517539413, 22.496259779135702],
      value: 30,
      coordZ: 64,
      type: 'legend02',
    },
    {
      id: '10',
      coord: [113.886043106853, 22.4974770351022],
      value: 15,
      coordZ: 64,
      type: 'legend03',
    },
    {
      id: '11',
      coord: [113.886728075736, 22.4983386403116],
      value: 15,
      coordZ: 64,
      type: 'legend04',
    },
    {
      id: '12',
      coord: [113.88895679190199, 22.498007082118903],
      value: 95,
      coordZ: 64,
      type: 'legend05',
    },
    {
      id: '13',
      coord: [113.89079887273, 22.4986961488391],
      value: 75,
      coordZ: 64,
      type: 'legend06',
    },
    {
      id: '14',
      coord: [113.89174122254299, 22.5007460321014],
      value: 45,
      coordZ: 64,
      type: 'legend07',
    },
  ],
};
appInstance.uniCall('updateBubbleLayerCoord', jsonData, (result) => {
  console.log(result);
});

参数描述 ​

属性类型说明
idString图层对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别
nameString图层名称,支持为图层自定义名称
coordTypeStringXY 轴坐标类别,0:X 经度,Y 纬度;1:X 米,Y 米,相对世界 00 点
coordTypeZNumberZ 轴坐标类别,0:相对 3D 世界 0 海拔;1:相对 3D 世界地表;2:相对 3D 模型表面(单位:米) 目前该属性仅支持属性值为 0
coordZNumber高度(单位:米)
isAppendBoolean是否追加数据(按数据顺序),true:按新数据 更新原有重复数据 & 追加新数据;false:清除原有数据 & 重建新数据
dataArray定义图层可视化数据
data[0].idString图层子对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别
data[0].coordArrayXY 轴坐标,X:经度;Y:纬度
data[0].coordZNumberZ 轴高度(单位:米)
data[0].valueNumber数据点权值
data[0].typeString数据点图例类别

回调数据 ​

JSON
{
  "result": 1,
  "message": "成功。"
}

回调数据参数描述 ​

属性类型说明
resultNumber1:代表成功;0:代表失败
messageString成功或者失败原因

返回本章目录

3. 更新气泡图样式 ​

引入版本:3.0 起支持

功能描述 ​

更新三维场景中添加气泡图的样式

调用方法 ​

JavaScript
let jsonData = {
  id: 'bubble',
  fillArea: 'none',
  speed: 20,
  radiusMax: 400,
  radiusMin: 100,
  valueMax: 600,
  valueMin: 100,
  legends: [
    {
      name: 'legend01',
      color: '#D900D9',
    },
    {
      name: 'legend02',
      color: '#00468C',
    },
    {
      name: 'legend03',
      color: '#8500B2',
    },
    {
      name: 'legend04',
      color: '#4000FF',
    },
    {
      name: 'legend05',
      color: '#4DFFFF',
    },
    {
      name: 'legend06',
      color: '#00FF80',
    },
    {
      name: 'legend07',
      color: '#008C00',
    },
  ],
};

appInstance.uniCall('updateBubbleLayerStyle', jsonData, (result) => {
  console.log(result);
});

参数描述 ​

属性类型说明
idString图层对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别
fillAreaString区域填充样式类别,详见下表:区域填充样式类别
speedNumber气泡扩散速度(单位:米/秒)
radiusMaxNumber气泡最大半径(单位:米)
radiusMinNumber气泡最小半径(单位:米)
valueMaxNumber最大值上限
valueMinNumber最小值下限
legendsArray定义图层包含图例,支持为不同图例定义各自样式
legends[0].nameString图层内图例名称,新建时调用者自己传入的唯一名称,用于各种操作的图例识别
legends[0].colorString颜色(HEX 颜色值)

回调数据 ​

JSON
{
  "result": 1,
  "message": "成功。"
}

回调数据参数描述 ​

属性类型说明
resultNumber1:代表成功;0:代表失败
messageString成功或者失败原因

返回本章目录

4. 删除气泡图 ​

引入版本:3.0 起支持

功能描述 ​

删除气泡图

调用方法 ​

JavaScript
let jsonData = {
  id: 'bubble',
  overlayType: 'bubbleLayer',
};

appInstance.uniCall('removeOverlay', jsonData, (result) => {
  console.log(result);
});

参数描述 ​

属性类型说明
idString图层对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别
overlayTypeString图层对象类别

回调数据 ​

JSON
{
  "result": 1,
  "message": "成功。"
}

回调数据参数描述 ​

属性类型说明
resultNumber1:代表成功;0:代表失败
messageString成功或者失败原因

流渲染效果图 ​

系统架构图

端渲染效果图 ​

系统架构图

返回本章目录