Appearance
路径段热力图操作
目录
1. 添加路径段热力图
引入版本:3.1 起支持
功能描述
在三维场景中添加路径段热力图
调用方法
JavaScript
let jsonData = {
id: 'idObj',
name: 'layerName',
coordType: 0,
coordTypeZ: 0,
alpha: 1,
width: 30,
colorMax: '#FF0000',
colorMin: '#00FF00',
usingLegends: false,
valueMax: 1000,
valueMin: 0,
lineSpeed: 10,
lineDataId: 'lineDataId',
visible: true,
tags: ['tag1', 'tag2', 'tag3'],
segments: [
{
name: 'segment01',
points: [
{
coord: [113.9515886155735, 22.530255482736806],
coordZ: 64,
},
{
coord: [113.9375886155735, 22.530255482736806],
coordZ: 64,
},
],
},
{
name: 'segment02',
points: [
{
coord: [113.9375886155735, 22.530255482736806],
coordZ: 64,
},
{
coord: [113.9375886155735, 22.516255482736806],
coordZ: 64,
},
],
},
{
name: 'segment03',
points: [
{
coord: [113.9375886155735, 22.516255482736806],
coordZ: 64,
},
{
coord: [113.9515886155735, 22.516255482736806],
coordZ: 64,
},
],
},
{
name: 'segment04',
points: [
{
coord: [113.9515886155735, 22.516255482736806],
coordZ: 64,
},
{
coord: [113.9515886155735, 22.530255482736806],
coordZ: 64,
},
],
},
{
name: 'segment05',
points: [
{
coord: [113.9505886155735, 22.528255482736806],
coordZ: 64,
},
{
coord: [113.9385886155735, 22.528255482736806],
coordZ: 64,
},
],
},
{
name: 'segment06',
points: [
{
coord: [113.9385886155735, 22.528255482736806],
coordZ: 64,
},
{
coord: [113.9385886155735, 22.517255482736806],
coordZ: 64,
},
],
},
{
name: 'segment07',
points: [
{
coord: [113.9385886155735, 22.517255482736806],
coordZ: 64,
},
{
coord: [113.9505886155735, 22.517255482736806],
coordZ: 64,
},
],
},
{
name: 'segment08',
points: [
{
coord: [113.9505886155735, 22.517255482736806],
coordZ: 64,
},
{
coord: [113.9505886155735, 22.528255482736806],
coordZ: 64,
},
],
},
{
name: 'segment09',
points: [
{
coord: [113.9495886155735, 22.526255482736806],
coordZ: 64,
},
{
coord: [113.9395886155735, 22.526255482736806],
coordZ: 64,
},
],
},
{
name: 'segment10',
points: [
{
coord: [113.9395886155735, 22.526255482736806],
coordZ: 64,
},
{
coord: [113.9395886155735, 22.518255482736806],
coordZ: 64,
},
],
},
{
name: 'segment11',
points: [
{
coord: [113.9395886155735, 22.518255482736806],
coordZ: 64,
},
{
coord: [113.9495886155735, 22.518255482736806],
coordZ: 64,
},
],
},
{
name: 'segment12',
points: [
{
coord: [113.9495886155735, 22.518255482736806],
coordZ: 64,
},
{
coord: [113.9495886155735, 22.526255482736806],
coordZ: 64,
},
],
},
],
legends: [
{
name: 'legendName1',
color: '#ff0000',
type: 'default',
valueMin: 0,
valueMax: 1,
},
{
name: 'legendName1',
color: '#00ff00',
type: 'default',
valueMin: 1,
valueMax: 2,
},
],
data: [
{
name: 'segment01',
value: 0,
},
{
name: 'segment02',
value: 500,
},
{
name: 'segment03',
value: 750,
},
{
name: 'segment04',
value: 1000,
},
{
name: 'segment05',
value: 150,
},
{
name: 'segment06',
value: 750,
},
{
name: 'segment07',
value: 500,
},
{
name: 'segment08',
value: 1000,
},
{
name: 'segment09',
value: 500,
},
{
name: 'segment10',
value: 0,
},
{
name: 'segment11',
value: 1000,
},
{
name: 'segment12',
value: 750,
},
],
};
appInstance.uniCall('addRoadSgHeatLayerCoord', jsonData, (result) => {
console.log(result);
});参数描述
| 属性 | 类型 | 说明 | 端渲染 | 流渲染 |
|---|---|---|---|---|
| id | String | 图层对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别 | 支持 | 支持 |
| name | String | 图层名称,支持为图层自定义名称 | 支持 | 支持 |
| coordType | Number | XY 轴坐标类别,0:X 经度,Y 纬度;1:X 米,Y 米,相对世界 00 点 | 支持 | 支持 |
| coordTypeZ | Number | Z 轴坐标类别,0:相对 3D 世界 0 海拔;1:相对 3D 世界地表;2:相对 3D 模型表面(单位:米) | 支持 | 支持 |
| alpha | Number | 透明度,0:完全透明;1:完全不透明 | 支持 | 支持 |
| width | Number | 路径宽度(单位:米) | 支持 | 支持 |
| colorMax | String | 最大值上限颜色(HEX 颜色值) | 支持 | 支持 |
| colorMin | String | 最小值下限颜色(HEX 颜色值) | 支持 | 支持 |
| usingLegends | Boolean | 样式是否使用图例配置,默认是 false,false:不使用 legends 配置样式,使用 colorMax 和 colorMin,true:使用 legends 配置样式,如果数据权值没有包括在 legends 范围内,使用 colorMin 作为默认颜色 | 不支持 | 支持 |
| valueMax | Number | 最大值上限 | 支持 | 支持 |
| valueMin | Number | 最小值下限 | 支持 | 支持 |
| linespeed | Number | 路线流动速度(单位:米/秒) | 不支持 | 支持 |
| lineDataId | String | 对应本服务器上线数据对象,如果找到 lineDataId,则 segments 不起作用 | 支持 | 支持 |
| visible | Boolean | 添加当前图层时默认显示还是隐藏 | 支持 | 支持 |
| tags | Array | 用户自定标签数组,用于保存用户的扩展数据,或者可以控制显隐 | 不支持 | 支持 |
| segments | Array | 定义基础路段数据,支持不同路段表现为不同热力颜色 | 支持 | 支持 |
| segments[0].name | String | 图层路段子对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别 | 支持 | 支持 |
| segments[0].points | Array | 定义段途径点 | 支持 | 支持 |
| segments[0].points[0].coord | Array | XY 轴坐标,X:经度;Y:纬度 | 支持 | 支持 |
| segments[0].points[0].coordZ | Number | Z 轴高度(单位:米) | 支持 | 支持 |
| legends | Array | 定义路径段的图例,为不同的 value 值域范围定义各自样式 | 不支持 | 支持 |
| legends[0].name | String | 图例名称,新建时调用者自己传入的唯一名称,用于各种操作的图例识别 | 不支持 | 支持 |
| legends[0].color | String | 颜色(HEX 颜色值) | 不支持 | 支持 |
| legends[0].type | String | 路线样式类别, default 实线型, arrow 箭头型, dot 虚线型 | 不支持 | 支持 |
| legends[0].valueMin | String | 数据权值范围的最小值(包含),大于等于 valueMin 且小于 valueMax 的数据会使用这个图例样式 | 不支持 | 支持 |
| legends[0].valueMax | String | 数据权值范围的最大值(不包含),大于等于 valueMin 且小于 valueMax 的数据会使用这个图例样式 | 不支持 | 支持 |
| data | Array | 定义图层可视化数据 | 支持 | 支持 |
| data[0].name | String | 数据点路段名称 | 支持 | 支持 |
| data[0].value | Number | 数据点权值 | 支持 | 支持 |
回调数据
JSON
{
"result": 1,
"message": "成功。"
}回调数据参数描述
| 属性 | 类型 | 说明 |
|---|---|---|
| result | Number | 1:代表成功;0:代表失败 |
| message | String | 成功或者失败原因 |
2. 更新路径段热力图数据
引入版本:3.1 起支持
功能描述
更新三维场景中添加路径段热力图的数据
调用方法
JavaScript
let jsonData = {
id: 'idObj',
isAppend: true,
tags: ['tag1', 'tag2', 'tag3'],
data: [
{
name: 'segment01',
value: 0,
},
{
name: 'segment02',
value: 0,
},
{
name: 'segment03',
value: 0,
},
{
name: 'segment04',
value: 0,
},
{
name: 'segment05',
value: 500,
},
{
name: 'segment06',
value: 500,
},
{
name: 'segment07',
value: 500,
},
{
name: 'segment08',
value: 500,
},
{
name: 'segment09',
value: 1000,
},
{
name: 'segment10',
value: 1000,
},
{
name: 'segment11',
value: 1000,
},
{
name: 'segment12',
value: 1000,
},
],
};
appInstance.uniCall('updateRoadSgHeatLayerCoord', jsonData, (result) => {
console.log(result);
});参数描述
| 属性 | 类型 | 说明 | 端渲染 | 流渲染 |
|---|---|---|---|---|
| id | String | 图层对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别 | 支持 | 支持 |
| isAppend | Boolean | 是否追加数据(按数据顺序),true:按新数据 更新原有重复数据 & 追加新数据;false:清除原有数据 & 重建新数据 | 支持 | 支持 |
| tags | Array | 用户自定标签数组,用于保存用户的扩展数据,或者可以控制显隐 | 不支持 | 支持 |
| data | Array | 定义图层可视化数据 | 支持 | 支持 |
| data[0].name | String | 数据点路段名称 | 支持 | 支持 |
| data[0].value | Number | 数据点权值 | 支持 | 支持 |
回调数据
JSON
{
"result": 1,
"message": "成功。"
}回调数据参数描述
| 属性 | 类型 | 说明 |
|---|---|---|
| result | Number | 1:代表成功;0:代表失败 |
| message | String | 成功或者失败原因 |
3. 更新路径段热力图样式
引入版本:3.1 起支持
功能描述
更新三维场景中添加路径段热力图的样式
调用方法
JavaScript
let jsonData = {
id: 'idObj',
alpha: 0.5,
width: 50,
colorMax: '#ff0000',
colorMin: '#ff00ff',
usingLegends: false,
valueMax: 1200,
valueMin: 0,
lineSpeed: 10,
legends: [
{
name: 'legendName1',
color: '#ff0000',
type: 'default',
valueMin: 0,
valueMax: 1,
},
{
name: 'legendName1',
color: '#00ff00',
type: 'default',
valueMin: 1,
valueMax: 2,
},
],
};
appInstance.uniCall('updateRoadSgHeatLayerStyle', jsonData, (result) => {
console.log(result);
});参数描述
| 属性 | 类型 | 说明 | 端渲染 | 流渲染 |
|---|---|---|---|---|
| id | String | 图层对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别 | 支持 | 支持 |
| alpha | Number | 透明度,0:完全透明;1:完全不透明 | 支持 | 支持 |
| width | Number | 路径宽度(单位:米) | 支持 | 支持 |
| colorMax | String | 最大值上限颜色(HEX 颜色值) | 支持 | 支持 |
| colorMin | String | 最小值下限颜色(HEX 颜色值) | 支持 | 支持 |
| usingLegends | Boolean | 样式是否使用图例配置,默认是 false,false:不使用 legends 配置样式,使用 colorMax 和 colorMin,true:使用 legends 配置样式,如果数据权值没有包括在 legends 范围内,使用 colorMin 作为默认颜色 | 不支持 | 支持 |
| valueMax | Number | 最大值上限 | 支持 | 支持 |
| valueMin | Number | 最小值下限 | 支持 | 支持 |
| linespeed | Number | 路线流动速度(单位:米/秒) | 不支持 | 支持 |
| legends | Array | 定义路径段的图例,为不同的 value 值域范围定义各自样式 | 不支持 | 支持 |
| legends[0].name | String | 图例名称,新建时调用者自己传入的唯一名称,用于各种操作的图例识别 | 不支持 | 支持 |
| legends[0].color | String | 颜色(HEX 颜色值) | 不支持 | 支持 |
| legends[0].type | String | 路线样式类别, default 实线型, arrow 箭头型, dot 虚线型 | 不支持 | 支持 |
| legends[0].valueMin | String | 数据权值范围的最小值(包含),大于等于 valueMin 且小于 valueMax 的数据会使用这个图例样式 | 不支持 | 支持 |
| legends[0].valueMax | String | 数据权值范围的最大值(不包含),大于等于 valueMin 且小于 valueMax 的数据会使用这个图例样式 | 不支持 | 支持 |
回调数据
JSON
{
"result": 1,
"message": "成功。"
}回调数据参数描述
| 属性 | 类型 | 说明 |
|---|---|---|
| result | Number | 1:代表成功;0:代表失败 |
| message | String | 成功或者失败原因 |
4. 更新路径段热力图路段
引入版本:3.1 起支持
功能描述
更新三维场景中添加路径段热力图的路段
调用方法
JavaScript
let jsonData = {
id: 'idObj',
name: 'layerName',
coordType: 0,
coordTypeZ: 0,
isAppend: false,
segments: [
{
name: 'segment01',
points: [
{
coord: [113.945154525, 22.5325479965],
coordZ: 150,
},
{
coord: [113.9349563656, 22.5222341731],
coordZ: 150,
},
],
},
{
name: 'segment02',
points: [
{
coord: [113.9349563656, 22.5222341731],
coordZ: 150,
},
{
coord: [113.9555589769, 22.522076486],
coordZ: 150,
},
],
},
{
name: 'segment03',
points: [
{
coord: [113.9555589769, 22.522076486],
coordZ: 150,
},
{
coord: [113.945154525, 22.5325479965],
coordZ: 150,
},
],
},
{
name: 'segment04',
points: [
{
coord: [113.9451471935, 22.5310745627],
coordZ: 150,
},
{
coord: [113.9365372063, 22.5227642062],
coordZ: 150,
},
],
},
{
name: 'segment05',
points: [
{
coord: [113.9365372063, 22.5227642062],
coordZ: 150,
},
{
coord: [113.9532843087, 22.5228748729],
coordZ: 150,
},
],
},
{
name: 'segment06',
points: [
{
coord: [113.9532843087, 22.5228748729],
coordZ: 150,
},
{
coord: [113.9451471935, 22.5310745627],
coordZ: 150,
},
],
},
{
name: 'segment07',
points: [
{
coord: [113.9451477319, 22.5300791217],
coordZ: 150,
},
{
coord: [113.9379622599, 22.5232608469],
coordZ: 150,
},
],
},
{
name: 'segment08',
points: [
{
coord: [113.9379622599, 22.5232608469],
coordZ: 150,
},
{
coord: [113.9519180395, 22.5232611833],
coordZ: 150,
},
],
},
{
name: 'segment09',
points: [
{
coord: [113.9519180395, 22.5232611833],
coordZ: 150,
},
{
coord: [113.9451477319, 22.5300791217],
coordZ: 150,
},
],
},
],
};
appInstance.uniCall('updateRoadSgHeatLayerSegment', jsonData, (result) => {
console.log(result);
});参数描述
| 属性 | 类型 | 说明 |
|---|---|---|
| id | String | 图层对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别 |
| name | String | 图层名称,支持为图层自定义名称 |
| coordType | Number | XY 轴坐标类别,0:X 经度,Y 纬度;1:X 米,Y 米,相对世界 00 点 |
| coordTypeZ | Number | Z 轴坐标类别,0:相对 3D 世界 0 海拔;1:相对 3D 世界地表;2:相对 3D 模型表面(单位:米) |
| isAppend | Boolean | 是否追加数据(按数据顺序),true:按新数据 更新原有重复数据 & 追加新数据;false:清除原有数据 & 重建新数据 |
| segments | Array | 定义基础路段数据,支持不同路段表现为不同热力颜色 |
| segments[0].name | String | 图层路段子对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别 |
| segments[0].points | Array | 定义段途径点 |
| segments[0].points[0].coord | Array | XY 轴坐标,X:经度;Y:纬度 |
| segments[0].points[0].coordZ | Number | Z 轴高度(单位:米) |
回调数据
JSON
{
"result": 1,
"message": "成功。"
}回调数据参数描述
| 属性 | 类型 | 说明 |
|---|---|---|
| result | Number | 1:代表成功;0:代表失败 |
| message | String | 成功或者失败原因 |
5. 删除路径段热力图
引入版本:3.0 起支持
功能描述
删除路径段热力图
调用方法
JavaScript
let jsonData = {
id: 'idObj',
overlayType: 'roadSgHeatLayer',
};
appInstance.uniCall('removeOverlay', jsonData, (result) => {
console.log(result);
});参数描述
| 属性 | 类型 | 说明 |
|---|---|---|
| id | String | 图层对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别 |
| overlayType | String | 图层对象类别 |
回调数据
JSON
{
"result": 1,
"message": "成功。"
}回调数据参数描述
| 属性 | 类型 | 说明 |
|---|---|---|
| result | Number | 1:代表成功;0:代表失败 |
| message | String | 成功或者失败原因 |
路径段热力图流渲染效果图

路径段热力图端渲染效果图
