Skip to content

第十一章 GIS 图层操作 ​

目录 ​

TGAPI 支持添加多种 GIS 图层,

第一节 3DTile 倾斜摄影 ​

引入版本:3.1 起支持

添加 3DTile 倾斜摄影

JavaScript
let jsonData = {   id: "idObj",                      // 图层对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别
    name: "layerName",                               // 图层名称,支持为图层自定义名称
    url: 'http://mapserver/beijing/tileset.json',    // 3dTile入口描述文件地址
    type: "b3dm",                                    // 3dTile类别,b3dm; i3dm;s3dm,目前仅支持 b3dm
    token: 'ABCDEFG',                                // 预留字段
    visible: true,                                  // 显隐控制,true:显示;false:隐藏
    alpha: 0.5	                                     // 透明度,0:完全透明;1:完全不透明
}    
appInstance.uniCall('add3DTile', jsonData, (result) => {
  console.log(result);
});

更新 3DTile 倾斜摄影

JavaScript
let jsonData = {   id: "idObj",                       // 图层对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别
    name: "layerName",                                // 图层名称,支持为图层自定义名称
    url: 'http://mapserver/beijing/tileset.json',     // 3dTile入口描述文件地址
    visible: true,                                    // 3dTile类别,b3dm; i3dm;s3dm,目前仅支持 b3dm
    token: 'ABCDEFG'                                  // 预留字段
}    


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

更新 3DTile 倾斜摄影 样式

JavaScript
let jsonData = {   id: "idObj",                     // 图层对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别
    visible: true,                                  // 显隐控制,true:显示;false:隐藏
    alpha: 0.1	                                    // 透明度,0:完全透明;1:完全不透明
}    
appInstance.uniCall('updateGISMapStyle', jsonData, (result) => {
  console.log(result);
});

返回本章目录

第二节 TMS 瓦片 ​

引入版本:3.0 起支持

添加 TMS 瓦片

JavaScript
let jsonData = {
    id: 'idObj',             // 图层对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别
    name: 'layerName',       // 图层名称,支持为图层自定义名称
    mapUrl: 'http://mapserver/beijing/tileset.json', // 地表瓦片入口描述文件地址
    mapType: 'TMS',          // WMTS 的地图数据格式类别,目前仅支持 "TMS"
    mapToken: 'ABCDEFG',     // 预留字段
    terrainUrl: 'http://mapserver/beijing/tileset.json', // 高程瓦片入口描述文件地址
    terrainType: 'TMS',      // WMTS 的高程数据格式类别,目前仅支持 "TMS"
    terrainToken: 'ABCDEFG', // 预留字段
    visible: true,           // 显隐控制,true:显示;false:隐藏
    alpha: 0.5               // 透明度,0:完全透明;1:完全不透明
};

appInstance.uniCall(
    'clearOverlayType', {
        overlayType: 'gisMap', // 覆盖物类型,支持 all
    },
    result => {
        console.log(result);
    }
);
appInstance.uniCall('addGISMap', jsonData, result => {
    console.log(result);
    if (result.result === 1) {
        appInstance.uniCall(
            'focusById', {
                id: 'idObj',
                overlayType: 'gisMap',
                distance: 2000
            },
            focusResult => {
                console.log(focusResult);
            }
        );
    }
});

更新 TMS 瓦片 数据

JavaScript
let jsonData = {
  id: 'idObj',                                              // 图层对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别
  name: 'layerName',                                        // 图层名称,支持为图层自定义名称
  mapUrl: 'http://mapserver/beijing/tileset.json',          // 地表瓦片入口描述文件地址
  mapType: 'TMS',                                           // WMTS 的地图数据格式类别,目前仅支持 "TMS"
  mapToken: 'ABCDEFG',                                      // 预留字段
  terrainUrl: 'http://mapserver/beijing/tileset.json',      // 高程瓦片入口描述文件地址
  terrainType: 'TMS',                                       // WMTS 的高程数据格式类别,目前仅支持 "TMS"
  terrainToken: 'ABCDEFG'                                   // 预留字段
};

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

更新 TMS 瓦片 样式

JavaScript
let jsonData = {
  id: 'idObj',                         // 图层对象 id,新建时调用者自己传入的唯一标识,用于各种操作的对象识别
  visible: true,                       // 显隐控制,true:显示;false:隐藏
  alpha: 0.1                           // 透明度,0:完全透明;1:完全不透明
};

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

返回本章目录

第三节 WMS 图层数据 ​

引入版本:3.3.1 起支持

添加 WMS 图层

JavaScript
let jsonData = {   
    id: "idObj",                              // 图层对象 id,必须是已经通过addGISMap接口添加的已有id,一个GISMap地图只能添加一个WMSLayer,第二个添加的会覆盖第一个
    wmsUrl: 'http://mapserver/beijing/wms',   // WMS数据根地址,不需要“?”后面的参数
    layerName: "layer",                       // WMS数据中的某一个图层名称,必填
    tokenName: 'accessToken',                 // 预留字段,可以为空,在请求WMS地址的时候,会当作Url的Parameter的Key传入
    tokenValue: 'ABCDEFG',                    // 预留字段,可以为空,在请求WMS地址的时候,会当作Url的Parameter的值传入
    urlParams: 'filter="123"'                 // (只支持流渲染)这里的参数将会在向服务器请求的时候拼接进URL,参数前后不要有&符号,参数内可以有&符号。每个参数需要使用encodeURIComponent()函数进行转换
    visible: true,                            // 显隐控制,true:显示;false:隐藏
    alpha: 0.5                                // 透明度,0:完全透明;1:完全不透明
}

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

更新 WMS 图层数据

JavaScript
let jsonData = {   
    id: "idObj",                        // 图层对象 id,必须是通过addWMSLayer添加过的图层id
    visible: true,                      // 显隐控制,true:显示;false:隐藏
    alpha: 0.1	                        // 透明度,0:完全透明;1:完全不透明
}    

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

更新 WMS 图层样式

JavaScript
let jsonData = {   
    id: "idObj"                          // 图层对象 id,必须是通过addWMSLayer添加过的图层id
}    

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

返回本章目录