locoboy
locoboy

Reputation: 38960

Is there a way to add current location marker to gmaps4rails?

I'm trying to figure out how to add a current location marker to gmaps4rails map along with some map_points from the backend using @map_points = @user.places.to_gmaps4rails. I saw the following post:

How do I display the user's location with a marker in gmaps4rails?

and tried to implement the javascript there, but it doesn't seem to be working. I added this code to my javascript section, but for some reason the callback doesn't seem to be firing:

= gmaps("map_options" => {"detect_location" => true, "center_on_user" => true, "auto_zoom" => false, "zoom" => 12, "auto_adjust" => true, "markers" => {"data" => @map_points}})

:javascript
  Gmaps.map.callback = function() {
    Gmaps.map.addMarkers({Lat: Gmaps.map.userLocation.lat(), Lng: Gmaps.map.userLocation.lng(), rich_marker: null, marker_picture:""});
    }

EDIT: here's what I have now, but for some reason the addListenerOnce isn't firing:

- content_for :scripts do
  :javascript
    Gmaps.map.callback = function() {
      google.maps.event.addListenerOnce(Gmaps.map.getMapObject(),'idle', function(){
        navigator.geolocation.getCurrentPosition(add_map_marker,displayError);
      });

    };

    function add_map_marker(position){
      var lat = position.coords.latitude;
      var lng = position.coords.longitude;
      Gmaps.map.addMarkers([{
        "lng": lng,
        "lat": lat,
        "picture": "http://googlemaps.googlermania.com/google_maps_api_v3/en/Google_Maps_Marker.png",
        "width": "37",
        "height": "34"
      }]);
    }

    function displayError(error){
      alert('There is an error displaying location');
    }

Upvotes: 0

Views: 1590

Answers (2)

apneadiving
apneadiving

Reputation: 115541

You should use the addMarkers defined here.

You should pass a json array of markers as an argument, resulting from a to_gmaps4rails or with the same format.


Edit:

:javascript
  Gmaps.map.callback = function() {
    Gmaps.map.addMarkers([
      {"description": "", "title": "", "sidebar": "", "lng": "", "lat": "", "picture": "", "width": "", "height": ""}
    ]);
  }

If ever map doesn't exist yet, look here.

Upvotes: 2

Piotr Mąsior
Piotr Mąsior

Reputation: 1580

Where exactly you added that code? because I think without some reload such as:

Gmaps.loadMaps();

it will not work anyway... to solve that issue I guess you have to describe whole path. How exactly are you loading everything? If standard way, you need reload map.

I would recommend also to take closer look into (gmaps4rails source)

Gmaps4rails::JsBuilder.create_js 

method and if it is your default behavior try develop own method with this custom injection for callback (around line 34).

Other way is to call some ajax and with ujs do:

  $('#map').html('<%= escape_javascript( gmaps({:last_map => false}) ) %>');
  Gmaps.map = new Gmaps4RailsGoogle();
  Gmaps.load_map = function() {
    Gmaps.map.map_options.maxZoom = 15;
    Gmaps.map.initialize();
    Gmaps.map.markers = <%=raw @json %>;
    Gmaps.map.create_markers();
    Gmaps.map.adjustMapToBounds();
    Gmaps.map.callback();
  };
  Gmaps.loadMaps();

Upvotes: 1

Related Questions