title: Adding a triangle Polygon over OpenLayers OSM() Map
body: <p>I am trying to add one triangle Polygon over OSM() map in OpenLayers.</p>
  
  <pre><code>import Map from 'ol/Map';
  import View from 'ol/View';
  import Feature from 'ol/Feature';
  import {
      OSM,
      Vector as VectorSource
  } from 'ol/source';
  import $ from 'jquery';
  import {
      Tile as TileLayer,
      Vector as VectorLayer
  } from 'ol/layer';
  import {
      fromLonLat,
      toLonLat
  } from 'ol/proj';
  import Polygon from 'ol/geom/Polygon';
  
  import {
      Circle as CircleStyle,
      Fill,
      Stroke,
      Style
  } from 'ol/style.js';
  
  
  //Position of our map center
  
  var pos = fromLonLat([76.87403794962249, 8.569385045000772]);
  
  //Position for our Polygon
  
  var pos1 = fromLonLat([76.85860825505787, 8.575525035547585]);
  
  var pos2 = fromLonLat([76.85286067404068, 8.56925661298456]);
  
  var pos3 = fromLonLat([76.86300346314657, 8.56917303421666]);
  
  
  //OSM() Tile layer for our Map
  var tileLayer = new TileLayer({
      source: new OSM()
  });
  
  //Setting View for our Map
  var view = new View({
  
      center: pos,
      zoom: 15
  });
  
  var cord = [pos1,pos2,pos3];
  
  var polyone = new Polygon([cord]);
  
  var featureone = new Feature(polyone);
  
  var vectorSource = new VectorSource({
      feature: featureone
  });
  
  //vectorSource.addFeature(feature);
  featureone.setStyle(new Style({fill: new Fill({color: 'red'})}));
  
  var vectorLayer = new VectorLayer({
      source: vectorSource
  });
  
  var map = new Map({
  
      layers: [tileLayer,vectorLayer],
      target: 'map',
      view: view
  });
  </code></pre>
  
  <p>I have added the html part separately.</p>
  
  <p>OpenLayers version: ^5.1.3
  And I am using Parcel Bundler to create my test build
  After running the above code, only Map is getting displayed and no polygons displayed.</p>
  
  <p>Can anyone suggest an edit to my code?</p>