[英]How do I customize Google Map Marker Icon?
我不知道如何更改Google Map的标记图标。 这是我的代码。 大部分标记已显示。 我只想更改当前位置。
控制者
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
这是视图脚本。 area / _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"
我将不胜感激任何建议。
最后,我锻炼了。 像这样。
@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"
}
感谢所有的贡献!
如果您只想自定义Google的图标,则可以设置size
和color
否则, markers=icon:URLofIcon|markerLocation
URLofIcon
是您要使用的图标的URL,应该对其进行URL编码(使用一种缩短服务,该服务可能会对您进行URL编码并使代码看起来更好)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.