OpenLayers在SELECT交互中的地图上显示功能属性

Question

我有工作功能选择PointerMove工作和突出显示功能的交互。
我想获得的另一件事是在选定功能上显示功能属性。
我想在不在新的HTML元素或弹出窗口上的该特定功能上映射
在http://openlayers.org/en/latest/examples/select-features.html上进行了示例
任何帮助或欢迎的想法:)

roomsLayerEventMouserOver(layer)  {
    if( this.select ){
        this.map.removeInteraction(this.select);
    }
    this.select = new ol.interaction.Select({
        condition: ol.events.condition.pointerMove,
        layers: [
            layer
        ],
        style: this.getStyle('pink', 'red'),
    });
    this.map.addInteraction(this.select);
    this.select.on('select', (e) => {
        let features = e.target.getFeatures();
        features.forEach( (feature) => {
            console.log(feature.getProperties().name);
           // THIS IS PROBABLY THE PLACE I NEED SOMETHING
        });
    });
}

Answer 1

上述解决方案：

roomsLayerEventMouserOver(layer)  {
    if( this.select ){
        this.map.removeInteraction(this.select);
    }
    this.select = new ol.interaction.Select({
        condition: ol.events.condition.pointerMove,
        layers: [
            layer
        ],
        style: (feature) => { return this.roomsSelectedFeatureStyle(feature); }
    });
    this.map.addInteraction(this.select);
}

roomsSelectedFeatureStyle(feature) {
    let roomNumber = feature.getProperties().name ? feature.getProperties().name : " ";
    let style;
    style = new ol.style.Style({
        text: new ol.style.Text({
            text: roomNumber
        }),
        stroke: new ol.style.Stroke({
            color: LAYER_ROOM_HIGHLIGTH_COLOR_BORDER,
            width: 1
        }),
        fill: new ol.style.Fill({
            color: LAYER_ROOM_HIGHLIGTH_COLOR_FILL
        })
    });
    return style;
}