How to use Google Maps Stylers with jquery-ui-map plugin?
I am too weak at writing js. I need to create and configure a google map. For this I am using jquery-ui-map plugin and this code:
if ($("#map_canvas").length){
$('#map_canvas').gmap().bind('init', function(ev, map) {
$("[data-gmapping]").each(function(i,el) {
var data = $(el).data('gmapping');
$('#map_canvas').gmap('addMarker', {'id': data.id, 'tags':data.tags, 'position': new google.maps.LatLng(data.latlng.lat, data.latlng.lng), 'bounds':true }, function(map,marker) {
$(el).click(function() {
$(marker).triggerEvent('click');
});
}).click(function() {
$('#map_canvas').gmap('openInfoWindow', { 'content': $(el).find('.info-box').html() }, this);
});
});
});
}
Where do I need to insert these generated variables:
{ stylers: [ { lightness: 7 }, { saturation: -100 } ] }
The links I used are: http://code.google.com/p/jquery-ui-map/ http://gmaps-samples-v3.googlecode.com/svn/trunk/styledmaps/wizard/index.html
+3
source to share
1 answer
There are many places for example. to the display instance:
Now:
$('#map_canvas').gmap() //...more code
then
$('#map_canvas').gmap({styles:[{stylers:[{lightness:7},{saturation:-100}]}]}) //...more code
gmap-constructor accepts all options it accepts google.maps.Map.setOptions()
. One such option is "style", which is expected to be an array with google.maps.MapTypeStyle
(your generated output is MapTypeStyle)
+4
source to share