How to use the ol/Feature function in ol

searchGeoLayer.getSource().clear();

    // SET STATE CURRENT ITEM
    this.setState({ value, searchResults: [item] });
    if (item.place_id !== undefined || item.location_id == null) {
      this.initsearchLayers();

      // SET STATE CURRENT ITEM
      this.setState({ searchResults: [item] });

      // HANDLE OSM RESULT
      let coords = [];
      let feature = null;
      if (item.place_id !== undefined) {
        coords = helpers.toWebMercatorFromLatLong([item.x, Math.abs(item.y)]);
        feature = new Feature(new Point(coords));
      } else feature = new Feature(new Point([item.x, item.y]));

      feature.setProperties({ isPlaceOrGeocode: true });

      // SET SOURCE
      searchIconLayer.getSource().addFeature(feature);

      searchGeoLayer.setZIndex(100);
      searchIconLayer.setZIndex(100);

      // SET STYLE AND ZOOM
      searchGeoLayer.setStyle(styles["point"]);
      window.map.getView().fit(feature.getGeometry().getExtent(), window.map.getSize(), { duration: 1000 });
      window.map.getView().setZoom(18);
    } else {
      // CALL API TO GET LOCATION DETAILS

}
      //console.log(duration, options.duration, s)
      distance += options.distance;
      duration += options.duration;
      options.distanceT = distance;
      options.durationT = duration;
      f = new ol_Feature(options);
      routing.features.push(f);
    }
  }
  routing.distance = parseFloat(data.distanceMeters);
  routing.duration = parseFloat(data.durationSeconds);

  // Full route
  route = new ol_geom_LineString(route);
  routing.feature = new ol_Feature ({
    geometry: route.transform('EPSG:4326',this.getMap().getView().getProjection()),
    start: this._search[0].getTitle(start),
    end: this._search[0].getTitle(end), 
    distance: routing.distance,
    duration: routing.duration
  });

  // console.log(data, routing);
  this.dispatchEvent(routing);
  this.path = routing;
  return routing;
};

it('hides prompt for input text', () => {
        const wrapper = setupWrapper();
        const feat = new OlFeature(new OlGeomPoint([0, 0]));

        wrapper.setState({
          showLabelPrompt: true
        });

        feat.setStyle(new OlStyleStyle({
          text: new OlStyleText()
        }));
        feat.set('isLabel', true);

        wrapper.instance()._digitizeTextFeature = feat;
        wrapper.instance().onModalLabelOk();

        expect(wrapper.state().showLabelPrompt).toBeFalsy();
      });
    });

it('returns the difference of two instances of ol.geom.Polygon', () => {
          const poly1 = new OlFeature({
            geometry: new OlGeomPolygon(boxCoords)
          });
          const poly2 = new OlFeature({
            geometry: new OlGeomPolygon(boxCoords2)
          });
          const differenceFeature = GeometryUtil.difference(poly1, poly2, 'EPSG:4326');
          expect(differenceFeature instanceof OlFeature).toBe(true);
          expect(differenceFeature.getGeometry().getCoordinates()).toEqual(differenceBoxCoords);
        });
        it('returns poly1 if no difference is found', () => {

changeHandler_ (options) {
    let source = this.layer_.getSource()
    source.clear()
    let position = this.geolocation_.getPosition()
    source.addFeature(new Feature({ geometry: new Point(position) }))

    let circle = this.geolocation_.getAccuracyGeometry()
    source.addFeature(new Feature({ geometry: circle }))
    if (options.hasOwnProperty('initialRun') && options.initialRun) {
      this.getMap().get('move').toExtent(circle.getExtent(), { animated: this.animated_, maxZoom: this.maxZoom_ })
    } else {
      if (this.animated_) {
        this.getMap().getView().animate({ 'center': position })
      } else {
        this.getMap().getView().setCenter(position)
      }
    }
    if (options.hasOwnProperty('stopTracking')) {
      this.geolocation_.setTracking(!options.stopTracking)
    }
  }

setOlGeometry(olGeometry: OlGeometry) {
    const olFeature = new OlFeature({geometry: olGeometry});
    this.olOverlaySource.clear();
    this.olOverlaySource.addFeature(olFeature);
  }

});

    this.chicago.setStyle(new Style({
      image: new Icon(({
        color: '#8959A8',
        crossOrigin: 'anonymous',
        src: 'assets/vectorpoint.svg',
        imgSize: [20, 20]
      }))
    }));

    this.london = new Feature({
      geometry: new Point(fromLonLat([-0.12755, 51.507222]))
    });

    this.madrid = new Feature({
      geometry: new Point(fromLonLat([-3.683333, 40.4]))
    });

    this.london.setStyle(new Style({
      image: new Icon(({
        color: '#4271AE',
        crossOrigin: 'anonymous',
        src: 'assets/vectorpoint.svg',
        imgSize: [20, 20]
      }))
    }));

    this.madrid.setStyle(new Style({
      image: new Icon(({
        color: [113, 140, 0],
        crossOrigin: 'anonymous',

static intersection(polygon1, polygon2, projection = 'EPSG:3857') {
    const geoJsonFormat = new OlFormatGeoJSON({
      dataProjection: 'EPSG:4326',
      featureProjection: projection
    });
    const feat1 = polygon1 instanceof OlFeature ? polygon1
      : new OlFeature({
        geometry: polygon1
      });
    const feat2 = polygon2 instanceof OlFeature ? polygon2
      : new OlFeature({
        geometry: polygon2
      });
    const geojson1 = geoJsonFormat.writeFeatureObject(feat1);
    const geojson2 = geoJsonFormat.writeFeatureObject(feat2);
    const intersection = intersect(geojson1, geojson2);
    if (!intersection) {
      return null;
    }
    const feature = geoJsonFormat.readFeature(intersection);
    if (polygon1 instanceof OlFeature && polygon2 instanceof OlFeature) {
      return feature;
    } else {
      return feature.getGeometry();
    }
  }

addFeatures(dataSource: FeatureDataSource) {
    const feature1 = new olFeature({
      name: 'feature1',
      geometry: new olLineString([
        olproj.transform([-72, 47.8], 'EPSG:4326', 'EPSG:3857'),
        olproj.transform([-73.5, 47.4], 'EPSG:4326', 'EPSG:3857'),
        olproj.transform([-72.4, 48.6], 'EPSG:4326', 'EPSG:3857')
      ]),
    });

    const feature2 = new olFeature({
      name: 'feature2',
      geometry: new olPoint(
        olproj.transform([-73, 46.6], 'EPSG:4326', 'EPSG:3857')
      ),
    });

    const feature3 = new olFeature({

}


/**
 * @return {boolean} `false` to stop the drag sequence.
 */
function handleUpEvent() {
  this.coordinate_ = null;
  this.feature_ = null;
  return false;
}


const pointFeature = new Feature(new Point([0, 0]));

const lineFeature = new Feature(
  new LineString([[-1e7, 1e6], [-1e6, 3e6]]));

const polygonFeature = new Feature(
  new Polygon([[[-3e6, -1e6], [-3e6, 1e6],
    [-1e6, 1e6], [-1e6, -1e6], [-3e6, -1e6]]]));


const map = new Map({
  interactions: defaultInteractions().extend([new Drag()]),
  layers: [
    new TileLayer({
      source: new TileJSON({
        url: 'https://api.tiles.mapbox.com/v3/mapbox.geography-class.json?secure'
      })
    }),
    new VectorLayer({