1
votes

I am trying to create some custom maps. I am using ol3 because of the drag and drop feature. The idea is to be able to style each feature on the map.

I drag and drop .gpx and .json files exported from JOSM and create a unique overlay for each feature.

I can change the stroke color etc. with a style function on that overlay. That all works great until I do the next drop.

The dropped features seem to appear in some random order getting interspersed with the ones from the previous drop. I need to have some way to tell which features are new from that drop operation so I can style those without affecting the ones I have already styled.

Is there a unique identifier of some kind that I can get from the feature? Is there a way that I can tag a feature so with a unique id?

I tried feature.getId() but that is undefined at the time that the drag and drop event fires.

2

2 Answers

0
votes

You can define your feature(s) in a json format

var geoSource = new ol.source.GeoJSON({
    /* @type {olx.source.GeoJSONOptions} */
    "projection": "EPSG:3857"  //us
    , "object": {
        "type": "FeatureCollection"
        , "crs": { "type": "name", "properties": { "name": "EPSG:4326" } }//'EPSG:3857'//euro 'urn:ogc:def:crs:EPSG::4326'//'urn:ogc:def:crs:OGC:1.3:CRS84'
        , "features": [
          {
              "type": "Feature", "id": "01"
              , "geometry": { "type": "Point", "coordinates": [-80.0874386, 26.7816928] }
              , "properties": { "myproperty": "West Palm Beach" }
          }
        , {
            "type": "Feature", "id": "02"
            , "geometry": { "type": "Point", "coordinates": [-82.0838700, 26.9262480] }
            , "properties": { "myproperty": "Punta Gonda" }
        }
        ]
    }
});

Then you access the feature by

    var ff = geoSource.getFeatureById('02');
    alert(ff.getProperties()['myproperty']);

or if you need to analyse all the features, you can

    geoSource.getFeatures().forEach(function (ff) {
        alert(ff.getProperties()['myproperty']);
    })

Does it help? Good luck.

0
votes

when creating a feature, you can pass an object with custom properties to the constructor. For example:

var myFeature = new ol.Feature({
        geometry: ..., 
        labelPoint: ..,
        name:...,
        customProp1: ...,
        customProp2: ...,
        myCustomID: myRandomIDGenerator()
      })