How do you convert normal geographic json coming from server into geoJson?

Question

I have a server with geographic data in normal json format, which I need to change into geojson format so Mapbox can read it. How do you do this?

For example, how do you convert this:

[
  {
    "id": 0,
    "name": "Hotel",
    "icon": "Sleep",
    "address": "SampleStreet 34",
    "latitude": 12,
    "longitude": 55
  }
]

into this:

{
"type": "FeatureCollection",
  "features": [
    {
    "id": 0,
    "type": "Feature",
    "properties": {
      "placeID": 0,
      "name": "Hotel",
      "icon": "sleep",
      "addressFormatted": "SampleStreet 34"
    },
    "geometry": {
      "type": "Point",
      "coordinates": [
        12,
        55
      ]
    }
}

I assume you have to write a script, but I have no idea what that would look like - see json and geojson example above — kingloui, Apr 03 '19 at 14:20

score 2 · Answer 1 · edited Apr 12 '19 at 21:36

If you use ES6 then something like this might work for you, JSON.stringify might not be needed if you can use the resulting object directly.

const data = [
  {
    id: "0",
    name: "Hotel",
    icon: "Sleep",
    address: "SampleStreet 34",
    latitude: "12",
    longitude: "55"
  },
  {
    id: "1",
    name: "Landmark",
    icon: "Star",
    address: "SampleStreet 1234",
    latitude: "99",
    longitude: "100"
  }
];

const geojson = {
  type: "FeatureCollection",
  features: data.map(item => {
    return {
      id: item.id,
      type: "Feature",
      properties: {
        placeID: item.id,
        name: item.name,
        icon: item.icon,
        addressFormatted: item.address
      },
      geometry: {
        type: "Point",
        coordinates: [item.latitude, item.longitude]
      }
    };
  })
};

console.log(geojson);
console.log(JSON.stringify(geojson));

Mike M · Answer 2 · 2019-04-03T14:45:30.513

0

There are @turf libraries that will help with this, so you could do something like:

import { lineString as makeLineString } from '@turf/helpers';

and then use it like (note that longitude goes first)

var coords = [];
var dataarray = JSON.parse(thejson);
for (var i=0; i < dataarray.length; i++){
    obj = dataarray[i];
    coords.push([obj.long, obj.latitude]);    
}

let mapboxpoints = makeLineString(coords)

You should check out the mapbox examples here: https://github.com/nitaliano/react-native-mapbox-gl/tree/master/example/src

edited Apr 03 '19 at 14:45

answered Apr 03 '19 at 14:33

Mike M

4,358
1
28
48

I am very familiar with all of the mapbox examples - however, in none of them is there an example where they are getting json data from elsewhere which is not in the geojson format. Thus I need to write a script, for example a GeojsonTranslator.js file, which takes my raw json data, and turns it into geojson so mapbox can read it. – kingloui Apr 03 '19 at 14:38
@kingloui - you should just be able to convert your json file into an object using `JSON.parse`, and then just loop thru the array. I don't think it needs to be any more complicated than that. I've updated my answer. – Mike M Apr 03 '19 at 14:43
Okay, I'm not entirely sure how to do that - Could you perhaps explain a bit further? Or do you have an example of where that is done? – kingloui Apr 03 '19 at 21:39
Can you take a look at my answer? – kingloui Apr 04 '19 at 13:27

score 0 · Answer 3 · answered Apr 04 '19 at 13:26

I used GeoJson (https://www.npmjs.com/package/geojson) to parse my data, and it looks like the following which works quite well:

import GeoJSON from 'geojson';
import jsonData from './jsonData.json';

const json = jsonData;

const data = GeoJSON.parse(json, {
  Point: ['latitude', 'longitude'],
  include: ['name', 'icon', 'addressFormatted']
});

export default data;

What I'm missing now however, is my feature.id. Does anyone know how to incorporate that in? I do not want my id to be under properties.

How do you convert normal geographic json coming from server into geoJson?

3 Answers3

Linked