统一开发 API

Appearance

散点轮询 ​

此功能案例实现摄像机轮询地标图

目录 ​

1. 功能点 ​

  • 添加地标图层 addLandmarkLayer
  • 相机聚焦 focusByLayer

返回本章目录

2. 视频演示 ​

返回本章目录

3. 核心代码 ​

引入版本：3.0 起支持

第一步 ​

准备图层数据，添加图层

JavaScript
// 定义散点图标
let points = [
    {
        id: 'landmarkId1',                          // 图层子对象 id，新建时调用者自己传入的唯一标识，用于各种操作的对象识别
        label: '摄像头1',                            // 图标标签文本
        coord: [113.937824740773, 22.518918656536], // XY 轴坐标，X：经度；Y：纬度
        coordZ: 0,                                  // Z 轴高度（单位：米）
        type: 'legendName1'                         // 地标点的图例类别名称
    },
    {
        id: 'landmarkId3',
        label: '摄像头2',
        coord: [113.939667243932, 22.5222551824044],
        coordZ: 70,
        type: 'legendName1'
    },
    {
        id: 'landmarkId4',
        label: '摄像头3',
        coord: [113.946102105494, 22.5233873938033],
        coordZ: 70,
        type: 'legendName1'
    },
    {
        id: 'landmarkId5',
        label: '摄像头4',
        coord: [113.930779578267, 22.5277339044635],
        coordZ: 70,
        type: 'legendName1'
    }
]
    

// 添加散点图层
function addPoints() {
    let jsonData = {
        id: 'landmarkLayerId',        // 图层对象 id，新建时调用者自己传入的唯一标识，用于各种操作的对象识别
        name: 'layerName',            // 图层名称，支持为图层自定义名称
        coordType: 0,                 // XY 轴坐标类别，0：X 经度，Y 纬度；1：X 米，Y米，相对世界00点
        coordTypeZ: 0,                // Z 轴坐标类别，0：相对 3D 世界 0 海拔；1：相对 3D 世界地表；2：相对 3D 模型表面（单位：米）
        autoScale: false,             // 如果开启后，图标会按照摄像机远近自动缩放大小
        legends: [                    // 定义图层包含图例，支持为不同图例定义各自样式
            {
                name: 'legendName1',
                color: '#FFFFFF',
                iconName: 'camera'
            }
        ],
        data: points          // 定义图层可视化数据
    }
    window.appInstance.uniCall('addLandmarkLayer', jsonData, (res) => {
        console.log('添加散点', res)
        focusByLayer(points[0].id)
    })
}

第二步 ​

使用计时器，轮询散点

JavaScript

// 聚焦图层
function focusByLayer(id) {
    window.appInstance.uniCall('focusByLayer', {
        id: id,
        idLayer: 'landmarkLayerId',
        layerType: 'landmarkLayer', //含子对象图层类别 objLayerType，详见 内置枚举
        distance: 300
    })
}

// 实现镜头轮询定位
function cameraPolling() {
    clearInterval(window.timer)
    window.timer = setInterval(() => {
        index++
        index %= points.length
        focusByLayer(points[index].id)
    }, 2000)
}

返回本章目录

4. 代码下载 ​

点击跳转到下载页面

返回本章目录