title: OpenLayers Extension ol:ext FontSymbol form incorrect
body: <p>I'm trying to create a map with a simple marker based on OpenLayers with ol:ext.
  When defining the style of the marker via FontSymbol the surrounding form does not look like in the <a href="http://viglino.github.io/ol-ext/examples/style/map.style.font.html" rel="nofollow noreferrer">example</a>, but like a strangely transformed triangle.</p>
  
  <p>I'm a totally newbie in using OpenLayers, so I'm not sure, whether the problem is elsewhere (e.g. I'm really not sure about the definition of ol.Feature), but the problem results in rendering the form and the triangles transformation changes when selecting a different one (values from the <a href="http://viglino.github.io/ol-ext/doc/doc-pages/ol.style.FontSymbol.html" rel="nofollow noreferrer">API-Docs</a>), so I think it's got somthing to do with that.</p>
  
  <p>The relevant Part of my code so far:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var pos = {lat: 50.06882, lng: 16.71712};
  var zoom = 15;
  
  
  var map = new ol.Map({
              target: 'map',
              layers: [
                new ol.layer.Tile({
                  source: new ol.source.OSM()
                })
              ],
              view: new ol.View({
                center: ol.proj.fromLonLat([ pos.lng, pos.lat]),
                zoom: zoom
              })
          });
          
  
  var vector = new ol.layer.Vector({
      name: 'marker',
      source: new ol.source.Vector({
          features: [
              new ol.Feature({
                  geometry: new ol.geom.Point( ol.proj.fromLonLat([ pos.lng, pos.lat]) )
              })
          ]
      }),
      style: [
          new ol.style.Style({
              image: new ol.style.FontSymbol({
                      glyph: 'fa-star',
                      form: 'marker',
                      radius: '20',
                      offsetY: -15,
                      gradient: true,
                      fontSize: 1.0,
                      fontStyle: '',
                      rotation: 0*Math.PI/180,
                      rotateWithView: false,
                      color: 'white',
                      fill: new ol.style.Fill({
                          color: 'green',
                      }),
                      stroke: new ol.style.Stroke({
                          color: 'white',
                          width: 2,
                      }),
                  }),
                  stroke: new ol.style.Stroke({
                      width: 3,
                      color: 'white'
                  }),
                  fill: new ol.style.Fill({
                      color: [255, 136, 0, 0.6]
                  })
              }),
          new ol.style.Style(
              { image: new ol.style.Shadow(
                  { radius: 15,
                      blur: 5,
                      offsetX: 0,
                      offsetY: 0,
                      fill: new ol.style.Fill(
                      { color: "rgba(0,0,0,0.5)"
                      })
                  })
              })
          ]
  })
  
  map.addLayer(vector);</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!-- OL --&gt;
  &lt;link rel="stylesheet" href="//openlayers.org/en/latest/css/ol.css" /&gt;
  &lt;script type="text/javascript" src="//openlayers.org/en/latest/build/ol.js"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" href="//cdn.rawgit.com/Viglino/ol-ext/master/dist/ol-ext.css" /&gt;
  &lt;script type="text/javascript" src="//cdn.rawgit.com/Viglino/ol-ext/master/dist/ol-ext.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="//cdn.rawgit.com/Viglino/ol-ext/master/dist/extra/FontAwesomeDef.js"&gt;&lt;/script&gt;
  
  &lt;!-- Map div --&gt;
  &lt;div id="map" style="width:600px; height:400px;"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>