# 真实贴图建筑(RealityBuilding)

真实贴图建筑图层相当于白模贴图拉伸图层的特化,图层接口延用拉伸图层的同时简化样式的配置,并额外支持分层交互功能。

# 示例

const layer = new aimap.RealityBuilding({
    mode: '3d',
    images: [{
        id: "building",        //图片id
        type: "texture",       //三维场景适用的材质类型
        url: `textures/building.png`,
	}],
    data: [{
        coordinates: [[[121.1, 31.2], [121.1, 31.3], [121.2, 31.3], [121.2, 31.2], [121.1, 31.2]]]
    }, {
        coordinates: [[[121.1, 31.2], [121.1, 31.3], [121.0, 31.3], [121.0, 31.2], [121.1, 31.2]]]
    }],
    style: {
        "building-height": 100, //建筑高度
        "building-opacity":  1, //建筑透明度
        "building-base": 0,     //建筑底部海拔高度
        "building-texture": params.defaultTexture, //建筑贴图
        "building-texture-scale": params.textureScale, //建筑贴图尺寸
    },
    floor: {
        height: 1,                  //分层高度
        "outline-color": "#fff",    //分层高亮边缘颜色
        "pick-color": "#fff",       //楼层选中颜色
        "hover-color": "#fff",      //交互悬停楼层颜色
    },
    map
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

# 真实贴图建筑样式说明

Extrusion样式名 取值范围 说明
building-texture image的id字段 对应图层images数据中的id字段
building-texture-scale [正数,正数] 贴图时uv方向上相对真实距离的比例
building-base 0~ 海拔高度
building-height 0~ 拉伸立体高度
building-opacity 0~1 透明度
height 0~[extrusion-height] floor额外样式。每层楼的高度,单位与extrusion-height相同。0等效于不分层。
outline-color color floor额外样式。分层边缘线颜色。
pick-color color floor额外样式。分层选中颜色。
hover-color color floor额外样式。分层悬停颜色。

# 楼层拾取事件

    layer.on("floorclick", (e) => {
        //e.features 选中的feature
        //e.floor 选中的楼层层数
    })
1
2
3
4

# 设置选中楼层

    //配合楼层点击事件使用
    layer.on("floorclick", (e) => {
        layer.setPick(e); //设置选中楼层
    });
1
2
3
4
最后更新于: 6/23/2022, 3:36:21 PM