如何自定义Google地图标记图标?

时间:2017-03-04 14:52:30

标签: javascript ruby-on-rails google-maps

我无法弄清楚如何更改Google地图的标记图标。 这是我的代码。已经显示了大部分标记。我只想更改当前位置。

控制器

  def restaurant_nearby
        @restaurants = Restaurant.near(params[:lat], params[:lng], params[:num], params[:lang])
        @hash = Gmaps4rails.build_markers(@restaurants.to_hash) do |r, marker|
                        marker.lat r["lat"]
                        marker.lng r["lng"]
                        marker.infowindow render_to_string(partial: "area/infowindow", locals: { place: r })
                        marker.json({title: r["restaurantname"]})
        end

        @hash_current_pos = {
                        lat: params[:lat],
                        lng: params[:lng],
                        icon: '/here.png',
                        infowindow: render_to_string(partial: "area/infowindow_current_pos"),
                        title: "You are here"
        }

        @hash = @hash.push(@hash_current_pos)

        content = render_to_string(:partial => 'area/restaurant_map', locals: {hash: @hash})
        render json: {html: content}, status: :ok
  end

这里的观点。 面积/ _restaurant_map.html.slim

javascript:
  jQuery(function(){

       mapStyle = [[{"featureType":"administrative.country","elementType":"geometry.fill","stylers":[{"saturation":"-35"}]}]];

      handler = Gmaps.build('Google');
      handler.buildMap({ provider: {styles: mapStyle}, internal: {id: 'map'}}, function(){
      markers = handler.addMarkers( #{raw hash.to_json});
      handler.bounds.extendWith(markers);
      handler.fitMapToBounds();
      handler.getMap().setZoom(15);
      });
 });

/! Le HTML5 shim, for IE6-8 support of HTML elements
/[if lt IE 9]
  = javascript_include_tag "//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.2/html5shiv.min.js"

我很欣赏任何建议。

2 个答案:

答案 0 :(得分:0)

最后,我解决了。像这样。

@hash_current_pos = {
                        lat: params[:lat],
                        lng: params[:lng],
                        picture: {url: '/here.png', width: 140, height: 180},
                        infowindow: render_to_string(partial: "area/infowindow_current_pos"),
                        title: "You are here"
        }

赞赏所有贡献!

答案 1 :(得分:-1)

如果您只想自定义Google的图标,可以设置sizecolor

否则,markers=icon:URLofIcon|markerLocation

URLofIcon是您要使用的图标的网址,应该是网址编码(使用缩短服务,可能会为您编码,并使代码看起来更好)