Upload json/shp/kml/kmz file and convert it into geojson

Question

I want to upload a json/shp/kml/kmz file and convert it into geojson.

HTML

<input type="file" name="uploadfile" accept=".json,.geojson,.shp,.kml,.kmz" id="file_loader" hidden>

<input type="text" id="upload_name" placeholder="Name" aria-label="Name" >

Javascript

var jsonObj;

var fileExt = upload_name.split('.').pop();           // Get file extension

var reader = new FileReader();                        // Read file into text
reader.readAsText($('#file_loader')[0].files[0]);
reader.onload = function(event) {
    if (fileExt == 'geojson')  {
        jsonObj = JSON.parse(event.target.result);    // Parse text into json
    } else if (fileExt == 'shp') {
        // how to convert event.target.result to geojson?
    } else if (fileExt == 'json') {
        // 
    } else if (fileExt == 'kml') {
        //
    } else if (fileExt == 'kmz') {
        //
    }
}

function addToMap(){
    // This function add jsonObj as a layer to Mapbox
    // No problem here
}

I've tried using https://www.npmjs.com/package/gtran by npm install gtran and then var gtran = require('gtran'); in my javascript file, but it gives me an error:

Could not find a declaration file for module 'gtran'

gtran doesn't have a @types/gtran.

My javascript file gets processed by webpack with babel-loader. Not sure if that has anything to do with the error.

Even if I successfully include gtran, its functions need filename as argument. My data is in a string and not a file, I don't have a filename. What do I do? Do I save the string in a file and then gtran that file?

Answer 1

You can't use var gtran = require('gtran'); in your frontend javascript file. It is used in Node.js .

However, you can use it with the aid of an extension like Browserify . See this post for more details.