Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

105
Views
WFS point Layer label is not displaying on openlayer 3

I have loaded the WFS point layer data from the geoServer Successfully. And I can plot the point layer also, but the label was not displaying. I added label as text param on Style part and the param looks like this text: '${name}',

Currently my code looks like this:

    var sourceWFS = new ol.source.Vector({
        format: new ol.format.GeoJSON({
            extractGeometryName: true
        }),
        title: geoServerLayerName,
        url: appConfigInfo.wfsurl + '/wfs?service=WFS&version=1.1.0&request=GetFeature&typename=' + geoServerLayerName + '&outputFormat=application/json',
        strategy: ol.loadingstrategy.bbox,
        projection: 'EPSG:4326'
    });
    var vectorLayerWFS = new ol.layer.Vector({
        source: sourceWFS,
        style: new ol.style.Style({
            image: new ol.style.Icon(({
                anchor: [0.5, 1],
                src: IconUrl
            })),
            text: new ol.style.Text({
                text: '${name}',
                font: '12px Calibri,sans-serif',
                fill: new ol.style.Fill({
                    color: '#000'
                }),
                stroke: new ol.style.Stroke({
                    color: '#fff',
                    width: 2
                }),
            })
        })
    });
    vectorLayerWFS.setProperties({
        title: layerName
    });
    mapObj.addLayer(vectorLayerWFS);
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

The text must be set in a style function

var style = new ol.style.Style({
        image: new ol.style.Icon(({
            anchor: [0.5, 1],
            src: IconUrl
        })),
        text: new ol.style.Text({
            font: '12px Calibri,sans-serif',
            fill: new ol.style.Fill({
                color: '#000'
            }),
            stroke: new ol.style.Stroke({
                color: '#fff',
                width: 2
            }),
        })
    });
var vectorLayerWFS = new ol.layer.Vector({
    source: sourceWFS,
    style: function(feature) {
        style.getText().setText(feature.get('name'));
        return style;
    }
});
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!