OpenLayers在选择交互时在地图上显示要素属性

OpenLayers在选择交互时在地图上显示要素属性,openlayers,Openlayers,我有工作功能选择点上的交互移动工作和突出显示功能。 我想得到的另一件事是显示选定特征的特征属性。 我希望在地图上看到该特定功能,而不是新的HTML元素或弹出窗口 在 欢迎您提供更多帮助或想法:) 上述问题的解决方案: roomsLayerEventMouserOver(layer) { if( this.select ){ this.map.removeInteraction(this.select); } this.select = new o

我有工作功能选择点上的交互移动工作和突出显示功能。
我想得到的另一件事是显示选定特征的特征属性。
我希望在地图上看到该特定功能,而不是新的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: (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;
}
上述问题的解决方案:

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;
}