CODEWITHSUNDEEP
javascriptgeospatialopenlayers
Captain Caveman
Captain Caveman

Reputation: 1526

Add Openlayers points to map as single layer

  plotBaseLayer (data) {
    this.setState({ data: data })

    const baseFeatures = []
    let baseLayer = Object()

    Object.keys(data.features).forEach((key) => {
      const basePoints = new olFeature({
        geometry: new olGeomPoint(olProj.transform(
          [data.features[key].geometry.coordinates[0], data.features[key].geometry.coordinates[1]],
          'EPSG:4326', MapHandler.map.getView().getProjection().getCode())
        )
      })

      baseFeatures.push(basePoints)
      const vectorSource = new olSourceVector()

      vectorSource.addFeature(basePoints)
      baseLayer = new olLayerVector({ source: vectorSource })

      this.map.addLayer(baseLayer)
    })
  }

Currently I am adding each point to a feature and individually adding that feature to the map as an individual layer. How may I structure my code and/or make use of alternative Openlayers functionality in order to plot all of the points as a single layer? Thanks for looking!

Upvotes: 1

Views: 515

Answers (1)

ylka
ylka

Reputation: 293

Is this maybe working?

 plotBaseLayer(data) {
    this.setState({
        data: data
    })
    const baseFeatures = []
    let baseLayer = Object()
    Object.keys(data.features).forEach((key) => {
            const basePoints = new olFeature({
                    geometry: new olGeomPoint(olProj.transform(
                            [data.features[key].geometry.coordinates[0], data.features[key].geometry.coordinates[1]],
                            'EPSG:4326', MapHandler.map.getView().getProjection().getCode()))
                })
                baseFeatures.push(basePoints)
    })

    const vectorSource = new ol.source.Vector({
       features: baseFeatures
    });


    baseLayer = new olLayerVector({
            source: vectorSource
    })
    this.map.addLayer(baseLayer)
 }

Upvotes: 1

Related Questions