统一开发 API

Appearance

栅格图操作 ​

目录 ​

1. 添加栅格图 ​

引入版本：3.0 起支持

功能描述 ​

在三维场景中添加栅格图

调用方法 ​

JavaScript
let jsonData = {
  id: 'grid',
  name: '栅格图',
  coordType: 0,
  coordTypeZ: 0,
  coordZ: 64,
  gridType: 'grid',
  gridHeight: 100,
  gridAlpha: 1,
  gridWidth: 50,
  colorMax: '#ff0000',
  colorMin: '#32c7ff',
  valueMax: 150,
  valueMin: 10,
  visible: true,
  pointDataId: 'pointDataId',
  data: [
    { id: '1', coord: [113.92955740017601, 22.5243823656461], value: 10 },
    { id: '2', coord: [113.92955740017601, 22.5247823656461], value: 74 },
    { id: '3', coord: [113.92955740017601, 22.5251823656461], value: 63 },
    { id: '4', coord: [113.92955740017601, 22.5255823656461], value: 119 },
    { id: '5', coord: [113.92955740017601, 22.525982365646094], value: 98 },
    { id: '6', coord: [113.92955740017601, 22.526382365646093], value: 76 },
    { id: '7', coord: [113.92955740017601, 22.526782365646092], value: 40 },
    { id: '8', coord: [113.92955740017601, 22.52718236564609], value: 48 },
    { id: '9', coord: [113.92995740017601, 22.5243823656461], value: 32 },
    { id: '10', coord: [113.92995740017601, 22.5247823656461], value: 80 },
    { id: '11', coord: [113.92995740017601, 22.5251823656461], value: 43 },
    { id: '12', coord: [113.92995740017601, 22.5255823656461], value: 33 },
    { id: '13', coord: [113.92995740017601, 22.525982365646094], value: 14 },
    { id: '14', coord: [113.92995740017601, 22.526382365646093], value: 43 },
    { id: '15', coord: [113.92995740017601, 22.526782365646092], value: 14 },
    { id: '16', coord: [113.92995740017601, 22.52718236564609], value: 46 },
    { id: '17', coord: [113.930357400176, 22.5243823656461], value: 30 },
    { id: '18', coord: [113.930357400176, 22.5247823656461], value: 33 },
    { id: '19', coord: [113.930357400176, 22.5251823656461], value: 25 },
    { id: '20', coord: [113.930357400176, 22.5255823656461], value: 43 },
    { id: '21', coord: [113.930357400176, 22.525982365646094], value: 24 },
    { id: '22', coord: [113.930357400176, 22.526382365646093], value: 100 },
    { id: '23', coord: [113.930357400176, 22.526782365646092], value: 87 },
    { id: '24', coord: [113.930357400176, 22.52718236564609], value: 135 },
    { id: '25', coord: [113.930757400176, 22.5243823656461], value: 110 },
    { id: '26', coord: [113.930757400176, 22.5247823656461], value: 151 },
    { id: '27', coord: [113.930757400176, 22.5251823656461], value: 136 },
    { id: '28', coord: [113.930757400176, 22.5255823656461], value: 144 },
    { id: '29', coord: [113.930757400176, 22.525982365646094], value: 110 },
    { id: '30', coord: [113.930757400176, 22.526382365646093], value: 83 },
    { id: '31', coord: [113.930757400176, 22.526782365646092], value: 53 },
    { id: '32', coord: [113.930757400176, 22.52718236564609], value: 29 },
    { id: '33', coord: [113.931157400176, 22.5243823656461], value: 1 },
    { id: '34', coord: [113.931157400176, 22.5247823656461], value: 79 },
    { id: '35', coord: [113.931157400176, 22.5251823656461], value: 31 },
    { id: '36', coord: [113.931157400176, 22.5255823656461], value: 44 },
    { id: '37', coord: [113.931157400176, 22.525982365646094], value: 18 },
    { id: '38', coord: [113.931157400176, 22.526382365646093], value: 62 },
    { id: '39', coord: [113.931157400176, 22.526782365646092], value: 32 },
    { id: '40', coord: [113.931157400176, 22.52718236564609], value: 43 },
    { id: '41', coord: [113.931557400176, 22.5243823656461], value: 11 },
    { id: '42', coord: [113.931557400176, 22.5247823656461], value: 56 },
    { id: '43', coord: [113.931557400176, 22.5251823656461], value: 38 },
    { id: '44', coord: [113.931557400176, 22.5255823656461], value: 97 },
    { id: '45', coord: [113.931557400176, 22.525982365646094], value: 80 },
    { id: '46', coord: [113.931557400176, 22.526382365646093], value: 124 },
    { id: '47', coord: [113.931557400176, 22.526782365646092], value: 76 },
    { id: '48', coord: [113.931557400176, 22.52718236564609], value: 115 },
    { id: '49', coord: [113.931957400176, 22.5243823656461], value: 101 },
    { id: '50', coord: [113.931957400176, 22.5247823656461], value: 84 },
    { id: '51', coord: [113.931957400176, 22.5251823656461], value: 49 },
    { id: '52', coord: [113.931957400176, 22.5255823656461], value: 121 },
    { id: '53', coord: [113.931957400176, 22.525982365646094], value: 72 },
    { id: '54', coord: [113.931957400176, 22.526382365646093], value: 65 },
    { id: '55', coord: [113.931957400176, 22.526782365646092], value: 28 },
    { id: '56', coord: [113.931957400176, 22.52718236564609], value: 44 },
    { id: '57', coord: [113.932357400176, 22.5243823656461], value: 2 },
    { id: '58', coord: [113.932357400176, 22.5247823656461], value: 56 },
    { id: '59', coord: [113.932357400176, 22.5251823656461], value: 33 },
    { id: '60', coord: [113.932357400176, 22.5255823656461], value: 53 },
    { id: '61', coord: [113.932357400176, 22.525982365646094], value: 31 },
    { id: '62', coord: [113.932357400176, 22.526382365646093], value: 55 },
    { id: '63', coord: [113.932357400176, 22.526782365646092], value: 30 },
    { id: '64', coord: [113.932357400176, 22.52718236564609], value: 44 },
    { id: '65', coord: [113.38675740017601, 22.5243823656461], value: 17 },
    { id: '66', coord: [113.38675740017601, 22.5247823656461], value: 35 },
    { id: '67', coord: [113.38675740017601, 22.5251823656461], value: 28 },
    { id: '68', coord: [113.38675740017601, 22.5255823656461], value: 49 },
    { id: '69', coord: [113.38675740017601, 22.525982365646094], value: 38 },
    { id: '70', coord: [113.38675740017601, 22.526382365646093], value: 110 },
    { id: '71', coord: [113.38675740017601, 22.526782365646092], value: 82 },
    { id: '72', coord: [113.38675740017601, 22.52718236564609], value: 101 },
  ],
};

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

参数描述 ​

属性类型说明
idString图层对象 id，新建时调用者自己传入的唯一标识，用于各种操作的对象识别
nameString图层名称，支持为图层自定义名称
coordTypeNumberXY 轴坐标类别，0：X 经度，Y 纬度；1：X 米，Y 米，相对世界 00 点
coordTypeZNumberZ 轴坐标类别，0：相对 3D 世界 0 海拔；1：相对 3D 世界地表；2：相对 3D 模型表面（单位：米）
coordZNumber高度(单位:米)
gridTypeString栅格外观类别，grid：方格；dot：圆点
gridHeightNumber单栅高度（单位：米）
gridAlphaNumber栅格透明度，0：完全透明；1：完全不透明
gridWidthNumber栅格宽度（单位：米）
colorMaxString最大值上限颜色（HEX 颜色值）
colorMinString最小值下限颜色（HEX 颜色值）
valueMaxNumber最大值上限
valueMinNumber最小值下限
visibleBoolean添加当前图层时默认显示还是隐藏
pointDataIdString对应本服务器上点数据对象，如果找到 pointDataId，则下方的 data 不起作用，（注意：端渲染未生效。）
dataArray数据点位基本信息集合
data[0].idString当前 ID
data[0].coordNumberXY 轴坐标，X：经度；Y：纬度
data[0].valueNumber数据点权值

回调数据 ​

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

回调数据参数描述 ​

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

返回本章目录

2. 更新栅格图数据 ​

引入版本：3.0 起支持

功能描述 ​

更新三维场景中添加栅格图的数据

调用方法 ​

JavaScript
let jsonData = {
  id: 'grid',
  name: '栅格图',
  coordType: 0,
  coordTypeZ: 0,
  coordZ: 64,
  isAppend: true,
  data: [
    {
      id: '0',
      coord: [113.883880901559, 22.500074150971802], //以深圳湾经纬度为例
      value: 80,
    },
    {
      id: '1',
      coord: [113.88412158908899, 22.4999546962148],
      value: 72,
    },
    {
      id: '2',
      coord: [113.884395229937, 22.499835175926503],
      value: 150,
    },
    {
      id: '3',
      coord: [113.884678855774, 22.499690634327102],
      value: 182,
    },
    {
      id: '4',
      coord: [113.885075328656, 22.4994668728112],
      value: 282,
    },
    {
      id: '5',
      coord: [113.88512925644599, 22.499436768755],
      value: 382,
    },
    {
      id: '6',
      coord: [113.885637569383, 22.499163782138503],
      value: 82,
    },
  ],
};

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

参数描述 ​

属性类型说明
idString图层对象 id，新建时调用者自己传入的唯一标识，用于各种操作的对象识别
nameString图层名称，支持为图层自定义名称
coordTypeStringXY 轴坐标类别，0：X 经度，Y 纬度；1：X 米，Y 米，相对世界 00 点 目前该属性仅支持属性值为 0
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].valueNumber数据点权值

回调数据 ​

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

回调数据参数描述 ​

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

返回本章目录

3. 更新栅格图样式 ​

引入版本：3.0 起支持

功能描述 ​

更新三维场景中添加栅格图的样式

调用方法 ​

JavaScript
let jsonData = {
  id: 'grid',
  gridType: 'dot',
  gridHeight: 10,
  gridAlpha: 1,
  gridWidth: 50,
  colorMax: '#008C8C',
  colorMin: '#FFFF99',
  valueMax: 200,
  valueMin: 30,
};

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

参数描述 ​

属性类型说明
idString图层对象 id，新建时调用者自己传入的唯一标识，用于各种操作的对象识别
gridTypeString栅格外观类别，grid：方格；dot：圆点
gridHeightNumber单栅高度（单位：米）
gridAlphaNumber栅格透明度，0：完全透明；1：完全不透明
gridWidthString栅格宽度（单位：米）
colorMaxNumber最大值上限颜色（HEX 颜色值）
colorMinNumber最小值下限颜色（HEX 颜色值）
valueMaxNumber最大值上限
valueMinNumber最小值下限

回调数据 ​

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

回调数据参数描述 ​

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

返回本章目录

4. 删除栅格图 ​

引入版本：3.0 起支持

功能描述 ​

删除栅格图

调用方法 ​

JavaScript
let jsonData = {
  id: 'grid',
  overlayType: '3DGridLayer',
};

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

参数描述 ​

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

回调数据 ​

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

回调数据参数描述 ​

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

流渲染效果图 ​

系统架构图

端渲染效果图 ​

系统架构图

返回本章目录