Openlayers 3: add text label to feature

前端 未结 2 927
再見小時候
再見小時候 2021-02-09 00:07

I have the current set up here: fully functional fiddle example and whilst I have managed to zoom to each polygon feature I would also like to display a centralised text label o

相关标签:
2条回答
  • 2021-02-09 00:23

    To add a text to ol.Feature you will store the description in the feature and set a style that is a style function (that will get the description from the feature and show it):

    field_polygon.set('description', field_title);
    field_polygon.setStyle(styleFunction);
    
    function styleFunction() {
      return [
        new ol.style.Style({
            fill: new ol.style.Fill({
            color: 'rgba(255,255,255,0.4)'
          }),
          stroke: new ol.style.Stroke({
            color: '#3399CC',
            width: 1.25
          }),
          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
            }),
            // get the text from the feature - `this` is ol.Feature
            // and show only under certain resolution
            text: map.getView().getZoom() > 12 ? this.get('description') : ''
          })
        })
      ];
    }
    

    Your fiddle.

    0 讨论(0)
  • 2021-02-09 00:35

    Since I am new here and are not allowed to comment, I put my comment as a new answer to the question of @andre_ss6. I also get Window on this. What works for me is passing in the feature object as the function's first parameter:

    function styleFunction(feature) {
    

    and then use that parameter instead of this:

    text: feature.get('description')
    
    0 讨论(0)
提交回复
热议问题