0
votes

I want to create a dynamic map using Ruby on Rails, geojson, gem rgeo-geojson, and mapbox.js.

I have a form where users input a country with a select generated by a JSON file listing all the countries.

I want Rails to compare it with a countries.geo.json file listing all countries, and then generate a marker on the map with the country selected.

Here is my application_helper.rb where I create the select option form :

  def countries_for_select
    file = File.read(Rails.root.join( 'app', 'helpers', 'countries.json'))
    countries = JSON.parse(file)
    countries.map {|c| [c['name']] }
  end

using countries.json file, and now I want to generate a marker on the map (mapbox) depending on which country user choose

My countries.json file is like that :

[
    {
        "name": "Afghanistan",
        "code": "AF"
    },
    {
        "name": "Åland Islands",
        "code": "AX"
    },
1
Can you elaborate a little more on your question? Show us some code, tell us what are you trying to do and what problems you're having. See stackoverflow.com/help/how-to-askThiago Belem
Hello @ThiagoBelem, I have no code for the moment, I just want to know how to proceedAntonin Mrchd
For the moment, I just have my select form created, generated with countries.json, and now, I would like to create a marker on my map (mapbox) using this country name selected by the userAntonin Mrchd
You proceed by attempting it yourself, then you ask a question about why it doesn't work. There is plenty of documentation available to get you started. All you have to do is read it.Damien Roche

1 Answers

0
votes

Why does a backend action need to be involved here?And secondly, if you want to draw markers on the map, don't you need geo data as well?

What about trying to

1.Source a countries geojson file(like https://github.com/johan/world.geo.json/blob/master/countries.geo.json)

2.Loading that json clientside with $.getJSON

3.Clientside templating a select box from all the country names in the properties hashes of each feature.

4.Setting a .change(function(){}) event handler on said select box which draws a point and moves the map depending on user input