title: OpenLayers 3: label position of circular features
body: <p>I have an application where users can upload data and create maps from Data. But sometimes some struggle with label positioning of circular geometries appears in OL.</p>
  
  <p>Circular elements get the label position in the "hole" instead inside the actual geometry, making the labels flying around, and sometimes unreadable.</p>
  
  <p>Is it somehow possible to force the labels to be inside the geometry?</p>
  
  <p>If you render something like this, you get the label in the center instead of the actual geometry:</p>
  
  <pre><code>{"bbox" : [ 1291894.8323655454, 6141624.110895131, 1292345.361152353, 6141834.360245953 ],
  "outOfFieldApplicationRate" : 0,
  "positionLostApplicationRate" : 120,
  "originalAnbauGeometrie" : "POLYGON ((11.6053336858749 48.209016852451384, 11.6074051973992 48.20968715883487, 11.6091102361679 48.20861645879208, 11.6073936223984 48.20876660678118, 11.606782078743 48.208759456886895, 11.6055375337601 48.20890960445681, 11.6053336858749 48.209016852451384))",
  "themaGeometrien" : [ {
      "geometrie" : "POLYGON ((1292195.1848900837 6141774.288475575, 1292225.2201425375 6141774.288475575, 1292225.2201425375 6141744.252748576, 1292255.2553949913 6141744.252748576, 1292255.2553949913 6141714.21712703, 1292315.3258998992 6141714.21712703, 1292315.3258998992 6141684.181610941, 1292345.361152353 6141684.181610941, 1292345.361152353 6141624.110895131, 1291924.8676179992 6141624.110895131, 1291924.8676179992 6141654.146200307, 1291894.8323655454 6141654.146200307, 1291894.8323655454 6141744.252748576, 1291924.8676179992 6141744.252748576, 1291924.8676179992 6141774.288475575, 1291984.9381229067 6141774.288475575, 1291984.9381229067 6141804.324308032, 1292045.0086278145 6141804.324308032, 1292045.0086278145 6141834.360245953, 1292165.14963763 6141834.360245953, 1292165.14963763 6141804.324308032, 1292195.1848900837 6141804.324308032, 1292195.1848900837 6141774.288475575), (1292045.0086278145 6141684.181610941, 1292165.14963763 6141684.181610941, 1292165.14963763 6141744.252748576, 1292014.9733753605 6141744.252748576, 1292014.9733753605 6141684.181610941, 1292045.0086278145 6141684.181610941))",
      "thema" : "00799dde-d988-8c57-a855-c4ddb5086e48",
      "applicationRate" : 200.0
    }, {
      "geometrie" : "POLYGON ((1292045.0086278145 6141744.252748576, 1292165.14963763 6141744.252748576, 1292165.14963763 6141684.181610941, 1292014.9733753605 6141684.181610941, 1292014.9733753605 6141744.252748576, 1292045.0086278145 6141744.252748576))",
      "thema" : "00799dde-d988-8c57-a855-c4ddb5086e48",
      "applicationRate" : 0.0
    } ]
  }
  </code></pre>
  
  <p>style:</p>
  
  <pre><code>    new ol.style.Style({
          fill: new ol.style.Fill({ color: color }),
          stroke: new ol.style.Stroke({
          color: 'grey',
          width: 1
      }),
      text: new ol.style.Text({
          font: '12px sans-serif',
          text: String(f.get('applicationRate')),
          fill: new ol.style.Fill({ color: color }),
          stroke: new ol.style.Stroke({ color: 'rgba(0, 0, 0, 0.5)', width: 3 })
          })
      })
  </code></pre>