Openlayers 3: add text label to feature

前端 未结 2 926
再見小時候
再見小時候 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.

提交回复
热议问题