Error : geoJSONObject is undefined

[geektortoise]

Hello,

I don't know how much my problem is related to #302 so I create a new one.
In the Cytomine project, we are using your vuelayers project.

When using vuelayers with the version 0.11.22, I got a problem to display features. The features are displayed but I got an error in the browser console. You will find the stacktraces below.

I don't have this error with vuelayers 0.11.4, so I tested with different version and

• I got the problem with version 0.11.7
• I cannot test version 0.11.5 or 0.11.6 due to problem upgrading to 0.11.5 #236
• I still have the problem with the version 0.11.23

Stacktraces :
In Firefox :
Unhandled promise rejection
TypeError: geoJSONObject is undefined
Stack trace:
readFeaturesFromObject@webpack-internal:///./node_modules/ol/format/GeoJSON.js:151:1
readFeatures@webpack-internal:///./node_modules/ol/format/JSONFeature.js:60:12
readSourceData@webpack-internal:///./node_modules/vuelayers/lib/vector-source/index.js:240:14
_callee$@webpack-internal:///./node_modules/vuelayers/lib/vector-source/index.js:163:32
...

In Chrome :
GeoJSON.js?a2e1:136 Uncaught (in promise) TypeError: Cannot read property 'type' of undefined
at GeoJSON.readFeaturesFromObject (GeoJSON.js?a2e1:136)
at GeoJSON.readFeatures (JSONFeature.js?377d:56)
at VueComponent.readSourceData (index.js?69ad:201)

Have a nice day !
Let me know if I can make some test to identify the origin of this problem.

[ghettovoice]

Hello @geektortoise ,
post here how do you use vl-source-vector component? I need to know how do you load features and see what actually passed to the vector source.
This error just tell us that something wrong with GeoJSON formatted features, probably missing of type key in feature object.

Take a note that each feature should be in format:

{
  "type": "Feature",
  "id": "...", // optional
  "properties": {}, // optional
  "geometry": {
    "type": "...",
    "coordinates": [...]
  }
}

[geektortoise]

Hello,

Thanks for the hint. :-)

I checked the component with the vl-source-vector and it seems that the error occurs when I do
this.$refs.olSource.addFeature(this.createFeature(annot));
https://github.com/cytomine/Cytomine-Web-UI/blob/master/src/components/viewer/AnnotationLayer.vue#L321

However, my createFeature function is the following

    createFeature(annot) {
      let feature = this.format.readFeature(annot.location);
      feature.setId(annot.id);
      feature.set('annot', annot);
      ///this.$store.dispatch...
      return feature;
    },

with
format: new WKT(),
and
import WKT from 'ol/format/WKT';

I tested by adding the type value but it doesn't work
In this pic, you'll see at the first line the "location" given as an input to format.readFeature and the returned feature.

in chromium :

Have a nice day

[ghettovoice]

Ok, you are adding features already read by format. I'm just think that it was malformed GeoJSON.
Seems I found the problem, the addFeature works incorrect in this case.
For a while a fix this, try to add features parsed by WKT format with this line this.$refs.olSource.$source.addFeature(this.createFeature(annot));

[geektortoise]

One eternity later

Thanks for the fix !

Have a nice day. :-)

[bmcalees]

@ghettovoice running into a similar issue as @geektortoise however I'm using addFeatures instead of addFeature. Is it possible this was fixed for one but not the other? Your workaround for referencing the $source seems to be working.

@geektortoise I'm assuming you were trying to update VueLayers within Cytomine? Any luck?

[ghettovoice]

@bmcalees with which version of vuelayers do you fall in this issue? v0.11 or v0.12?

[bmcalees]

@ghettovoice v0.12

[ghettovoice]

@bmcalees ok, I suppose that you call addFeatures inside the loader and returns nothing from it. At least I see that the loader can trigger error because it tries to parse undefined that is obviously incorrect.

For a while to avoid this error you can just return array of features where each element can be GeoJSON feature or instance of ol/Feature