featurecollection refusing to cooperate

[Simon Larsen]

so i've been trying to load geojson information from a webpage i have for about two weeks now, but no mater what i do i just can't get the featurecollection component to work the way i want, can anyone help?

the page is a json that contains this:

{"type":"FeatureCollection","features":[{"type":"Feature","geometry":{"type":"Polygon","coordinates":[[[10.416666666666666,40.375],[10.583333333333334,40.891666666666666],[10.25,40.891666666666666],[10.25,40.05833333333333],[10.583333333333334,40.05833333333333],[10.416666666666666,40.375]]]},"style":{"fill":"red","stroke-width":"3","fill-opacity":"0.4","stroke":"red","stroke-opacity":"0.8"},"properties":{"Name":"name1"}},{"type":"Feature","geometry":{"type":"Polygon","coordinates":[[[10.504166666666666,40.475],[10.4,40.575],[10.145833333333334,40.49166666666667],[10.25,40.391666666666666],[10.504166666666666,40.475]]]},"style":{"fill":"red","stroke-width":"3","fill-opacity":"0.4","stroke":"red","stroke-opacity":"0.8"},"properties":{"Name":"name2"}}]}

and when i feed this string directly into the "Features From GeoJson" like so

i get this on the app builder page

but it doesn't show up in the app when i run it. And when it comes to load the information from the page i can't get the load from url to work either, so what i have done is this, loading the information as a string using a web element.

and then i do this the test 2 label just says 0, the test2 label shows the geojson code i have provade in the top of this post.

i'm out of ideas, someone got something?

[Ghica]

Could you please post an .aia for us to work with?

Cheers, Ghica.

[SteveJG]

You do not provide a proper url  in your code  What you link to (     http://url/gk.json  ) in your Blocks  is not a valid url Simon.

What is the full url you use to obtain the json script you posted?     I can reproduce your polygon off the coast of Sardina using the json script.  What is impossible is to link to the 'url' you posted.  One should be able to get a response by posting http://url/gk.json into your browser, the link you supplied is invalid.

Regards,

Steve

[SteveJG]

Part of this is the result of a bug.   The Feature appears on the Designer when the JSON is input on the Designer screen but the Feature does not display on an Android 4.2.2 device.

This is true whether the JSON is posted in the Designer or using a Block with a Text block containing the JSON script.

This does not also work when the JSON is placed in Assets and called by the File control.  An error results when the Web 'translates;' text to JSON.

Also, initially, placing the JSON in FeaturesFromGeoJSON on the Designer does not display...and sometime it does (as shown in Simon's initial post).

-- Steve

[Simon Larsen]

sorry for the slow response, but i can't as it contains personal information

[Simon Larsen]

sorry for the slow response, i know it's not a invalid url, but i kept it so as i'm working on a project with a friend, and we don't want the url to be public know. however i don't think it's import, as my original post shows that what i have managed to create does indeed get the information that i wish, i only seem to have troubles showing them on the map.

[Simon Larsen]

sorry for the slow response, so are you saying that a bug is stopping me from showing the polygons on the map? also i appreciate your solution attempt, however it seems to require the information to be a file local on the phone or in the app, which is not useful as the reason i get the information from a web-page is that the features updates through out the day dynamically, and i need the app to reflect that.

[Simon Larsen]

and i can't get it to work either

[Ghica]

If you can display the information from a local file in a correct way on a map, then you can also display it after you first downloaded it from the web, using the Web component and the GotFile event.

But, I could not get Steve's example working either and I think one of the problems is that he tries to convert the JSON using the JSONDecode, but as it is already JSON, that should not be necessary.

I found a tutorial using the feature collection: https://drive.google.com/file/d/1dYafZl--DHQUt5cGol0wfHafPD0RTDKI/view

You can find it if you go to http://appinventor.mit.edu/explore/ai2/tutorials.html and filter by Map.

Maybe it is of use to you. I have not time right now to try it.

Cheers, Ghica.

[SteveJG]

@Simon  At the moment, the FeatureCollection is NOT working properly.  To help MIT debug this, you must provide a link to the original source Web page to see how that file is embedded on that page.  If we can not test, we cannot help.  The geoJSON file you are using is possibly incompatible with the tool.  This is a bug, so don't worry about it.  There is nothing you can do to import that file to your device and get the file to display.

@Ghica  The FeatureCollection is NOT working properly.   This is an MIT issue.  Yes, that article possibly works with the 'JSON' file MIT posted, unfortunately other JSON files do not work.  One of the problem is that I attempt to convert the JSON with JSONDecode (yes, that is an attempt because the example also was tried using the plain vanilla file and that does not work.  Copy and paste Simon's example Json in the FeaturesFromGeoJSON in the Designer, the 'feature' displays on the Designer screen.   Run the app and the feature does not display on the device screen.  The point of posting the example code is to demonstrate the FeatureCollection does not work as advertised.

All JSON geoJson files are NOT created equal.  Some work under ideal circumstances.    This control is broken.

Evan and I had a discussion some months ago about the issue; he said he would 'look at it'.

Edit:  The MIT provided usa-new-england.json file in the tutorial  does not work on a 4.2.2 tablet

--Steve

[Simon Larsen]

Again sorry for the slow response, and yes i had the same idea so i tried something like this, i know it's not finished i've re-worked it like 12 times, but i still appreciate your help and effort.

[Simon Larsen]

Again sorry for the slow response, alright any idea to whom and how i should send it?

I know it's not any of my business but why not use KML formatting?

[SteveJG]

You are doing a lot of work Simon.   By posting your code here, the developers will 'see' it.  This thread has been 'flagged' so the person responsible for maintaining the Map component will see the posts.   A problem is you are NOT providing a link to the Web page that hosts the geoJSON file.  They need that link too to help debug the Features part of the Map component.  They need to see how you are attempting to capture the gj from that Web page.

Why not KML (keyhole markup language)?    Good question Simon as that is one of the 'standard' ways of representing traks on maps by Geographic System Information .  GSI uses KML to exchange data between various mapping solutions.  MIT chose to use geoJSON, possibly because MIT use the OpenStreetMap API to implement the map component  and importing KML directly with OSM is difficult (see  https://wiki.openstreetmap.org/wiki/KML ).

If you want to use kml with the Map component, you can write an algorithm to convert the kml file to the Map Line component format.  A kml is a special version of an XML file and AI2 can work with that.  Sorry, I am not aware of any examples but this Forum discussion might help  https://groups.google.com/forum/#!category-topic/mitappinventortest/app-inventor-extensions/DqEeorciOC0  ..  the discussion shows directionally how you might 'create' a kml; knowing that you might 'translate' that to Line component format (which is basically a lot of latitude,longitude   points.  Or use the Polygon component.

Instead of using the Map component for your Project KML display (you do not have to use the Map component), you can use a Google Static Map instead (and use paths https://support.google.com/fusiontables/answer/171181?hl=en   ) or use a FusionTable and its map display (FusionTables can directly import KML files  This link shows the concept https://support.google.com/fusiontables/answer/2527132?hl=en .  This link shows how to import kml files https://support.google.com/fusiontables/answer/171181?hl=en ) or use the Google Javascript API and display a KML file on a  GoogleMap https://developers.google.com/maps/documentation/javascript/kml  (Advanced AI2 programmers can use javaScript in conjunction with Blocks).

If you must use the Map component, be very patient.  It might be a long time before MIT comes up with a solution  as they are busy fixing GooglePlay  and preparing to release the ios version of AI2.  At the moment, your 

just posted blocks will probably not allow you to display the Feature.  

-- Steve

[SteveJG]

Here is a possible solution to the Feature BUG using a LineString instead of a FeatureCollection.  This is a work around, the Feature object is still broken.  The work around requires manual manipulation of the geoJSON you provided.  The json probably could be manipulated with Blocks with a lot of extra effort.to reproduce the required strings.

This is the geoJSON you provided that does not render on an Android 4.2.2 device:

{"type":"FeatureCollection","features":[{"type":"Feature","geometry":{"type":"Polygon","coordinates":[[[10.416666666666666,40.375],[10.583333333333334,40.891666666666666],[10.25,40.891666666666666],[10.25,40.05833333333333],[10.583333333333334,40.05833333333333],[10.416666666666666,40.375]]]},"style":{"fill":"red","stroke-width":"3","fill-opacity":"0.4","stroke":"red","stroke-opacity":"0.8"},"properties":{"Name":"name1"}},{"type":"Feature","geometry":{"type":"Polygon","coordinates":[[[10.504166666666666,40.475],[10.4,40.575],[10.145833333333334,40.49166666666667],[10.25,40.391666666666666],[10.504166666666666,40.475]]]},"style":{"fill":"red","stroke-width":"3","fill-opacity":"0.4","stroke":"red","stroke-opacity":"0.8"},"properties":{"Name":"name2"}}]}

 I experimented and broke the geoJSON into parts in an attempto use the Map  LineString  and Polygon object to display what should have worked importing into the FeatureCollection but does not.:

-----------------------------------------

line  LineString1.PointsFromString experiments

[[40.475,10.50416],[40.575,10.4],[40.4916,10.14583],[40.3916,10.25],[40.475,10.50416]]   <this is the default script place holder on the Component

Importing part of your geoJSON file  (the critical coordinates) directly to the PointsFromString

[[10.416666666666666,40.375],[10.583333333333334,40.891666666666666],[10.25,40.891666666666666],[10.25,40.05833333333333],[10.583333333333334,40.05833333333333],[10.416666666666666,40.375]]

like the above, does not work in the component  The component requires  longitude/latitude instead of the more common convention of displaying latitude/longitude.

Reverse the latitude and longitude as shown below and paste in the LineString.PointsFromString block

[[40.375,10.416666666666666],[40.891666666666666,10.583333333333334],[40.891666666666666,10.25],[40.05833333333333,10.25],[40.05833333333333,10.583333333333334],[40.375,10.416666666666666]]

This way the LineString will work just fine showing part of your feature collection.  

--------------------------------------------------------------------

polygon  Polygon.HolePointsFromString experiments

[[42.349029598909965,-71.1024856567383],[42.3528354991833,-71.09819412231447],[42.349029598909965,-71.09390258789064]]   <this is the default for a Polygon

[[10.50416,40.475],[10.4,40.575],[10.14583,40.4916],[10.25,40.3916],[10.50416,40.475]]  <is the polygon from the JSON, however the latitude/longitude need to be reversed to be compatible with the Map component as shown below.

[[40.475,10.50416],[40.575,10.4],[40.4916,10.14583],[40.3916,10.25],[40.475,10.50416]]  < Here the latitude/longitude are reversed.  Unfortunately this trips an error  Error 3404:Parse error attempting to create Polygon ...Double cannot be converted toJSONArray.   So, the Polygon is broken on an Android 4.2.2 Tablet too.

---------------------------------------------------------------------

The LineString is usable, the Polygon component has a BUG

So to get the polygon part of the geoJSON coordinates, paste the following in the second LineString ..  [[40.475,10.50416],[40.575,10.4],[40.4916,10.14583],[40.3916,10.25],[40.475,10.50416]]   The code creates a polygon from segments.  Perhaps you can work this way to display some of the information you require into your app.

I experimented on a 4.2.2 Android, I do not know if a similar issue exists on new Android os devices.   Sorry, I loaned out my Android 7 Tablet. These hacks allow the polygons to display for me, hopefully for you too;

Good luck with your Project Simon.   I certainly hope this example helps.

Regards,

Steve

[Evan Patton]

Hi all,

Thanks for investigating this. I'll look into it and see what we can do to fix it. It's being tracked as issue #1387.

Regards,

Evan

[Simon Larsen]

Waow you put a lot of work into this, thanks man.

[Simon Larsen]

Glad to hear.

[SteveJG]

Thanks for posting the link to the gj.json file.  To retrieve that file your   set GetJson.url block would need to point to https://flightinfo.tek.sdu.dk/pages/gj.json, not  https://url/gj.json.   It is not obvious you intended the url part as a place holder.  Knowing how you would download the file helps. ,The code probably would work with the full link except for the bug. 

You still cannot download this json file and use it yet because of the bug which MIT has on its to do list. Hopefully the intended functionality will appear in AI2's next release.

Regards,

Steve

[Simon Larsen]

Uh, i thought it was obvious, oh well just show how much i know.
But it's nice to know that's it's a bug, and not me being stupid.
I'd like to thanks you for your help again, it's been helpful seeing that this my first time with app inventor, so thanks.