# 夜光效果建筑(LuminousBuilding)

夜光效果建筑图层相当于夜光效果拉伸图层的特化,图层接口延用拉伸图层的同时简化样式的配置,并额外支持分层交互功能。

# 示例

const layer = new aimap.LuminousBuilding({
    mode: '3d',
    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-luminous-bright": "#000",  // 自发光暗部颜色,
        "building-luminous-dark": "#fff", // 自发光亮部颜色,
    },
    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

# 夜光效果建筑样式说明

Extrusion样式名 取值范围 说明
building-luminous-bright color 夜光效果亮部颜色。
building-luminous-dark color 夜光效果暗部颜色。
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