styles option

[zmoddynamics]

Hi, I'm having some trouble setting the styles option.. Your docs say to specify this as an array so I've tried several variations:

$map = new Map([ 'center' => $coord, 'zoom' => 14, 'width'=> '100%', 'height'=>'400', 'styles'=> $gmapStyler, ]);

where $gmapStyler is constructed from the following javascript array:

Javascript: [{"stylers":[{"saturation":-100},{"gamma":1}]},{"elementType":"labels.text.stroke","stylers":[{"visibility":"off"}]},{"featureType":"poi.business","elementType":"labels.text","stylers":[{"visibility":"off"}]},{"featureType":"poi.business","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"poi.place_of_worship","elementType":"labels.text","stylers":[{"visibility":"off"}]},{"featureType":"poi.place_of_worship","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"road","elementType":"geometry","stylers":[{"visibility":"simplified"}]},{"featureType":"water","stylers":[{"visibility":"on"},{"saturation":50},{"gamma":0},{"hue":"#50a5d1"}]},{"featureType":"administrative.neighborhood","elementType":"labels.text.fill","stylers":[{"color":"#333333"}]},{"featureType":"road.local","elementType":"labels.text","stylers":[{"weight":0.5},{"color":"#333333"}]},{"featureType":"transit.station","elementType":"labels.icon","stylers":[{"gamma":1},{"saturation":50}]}]

I then replaced all occurrences of { with [ , } with ], and : with => to create a php associate array:

$gmapStyler = [["stylers"=>[["saturation"=>-100],["gamma"=>1]]],["elementType"=>"labels.text.stroke","stylers"=>[["visibility"=>"off"]]],["featureType"=>"poi.business","elementType"=>"labels.text","stylers"=>[["visibility"=>"off"]]],["featureType"=>"poi.business","elementType"=>"labels.icon","stylers"=>[["visibility"=>"off"]]],["featureType"=>"poi.place_of_worship","elementType"=>"labels.text","stylers"=>[["visibility"=>"off"]]],["featureType"=>"poi.place_of_worship","elementType"=>"labels.icon","stylers"=>[["visibility"=>"off"]]],["featureType"=>"road","elementType"=>"geometry","stylers"=>[["visibility"=>"simplified"]]],["featureType"=>"water","stylers"=>[["visibility"=>"on"],["saturation"=>50],["gamma"=>0],["hue"=>"#50a5d1"]]],["featureType"=>"administrative.neighborhood","elementType"=>"labels.text.fill","stylers"=>[["color"=>"#333333"]]],["featureType"=>"road.local","elementType"=>"labels.text","stylers"=>[["weight"=>0.5],["color"=>"#333333"]]],["featureType"=>"transit.station","elementType"=>"labels.icon","stylers"=>[["gamma"=>1],["saturation"=>50]]]];

This doesn't appear to work ?

[zmoddynamics]

I have finally have figured this out.. you must set it like this:

$gmapStyler = '[{"stylers":[{"saturation":-100},{"gamma":1}]},{"elementType":"labels.text.stroke","stylers":[{"visibility":"off"}]},{"featureType":"poi.business","elementType":"labels.text","stylers":[{"visibility":"off"}]},{"featureType":"poi.business","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"poi.place_of_worship","elementType":"labels.text","stylers":[{"visibility":"off"}]},{"featureType":"poi.place_of_worship","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"road","elementType":"geometry","stylers":[{"visibility":"simplified"}]},{"featureType":"water","stylers":[{"visibility":"on"},{"saturation":50},{"gamma":0},{"hue":"#50a5d1"}]},{"featureType":"administrative.neighborhood","elementType":"labels.text.fill","stylers":[{"color":"#333333"}]},{"featureType":"road.local","elementType":"labels.text","stylers":[{"weight":0.5},{"color":"#333333"}]},{"featureType":"transit.station","elementType":"labels.icon","stylers":[{"gamma":1},{"saturation":50}]}]';

So you pass it as a string containing the javascript array.

$map = new Map([
'center' => $coord,
'zoom' => 14,
'width'=> '100%',
'height'=>'400',
'styles'=> $gmapStyler,
]);

I looked in your class and you decode the value if it is valid JSON .. so this works as expected and styles the map accordingly.

Your documentation says that the 'styles' key is an array and so I was also trying :

$map = new Map([
                'center' => $coord,
                'zoom' => 14,
                'width'=> '100%',
                'height'=>'400',
                'styles'=> [$gmapStyler],
            ]);

But this does not work.. 

[tonydspaniard]

@zmoddynamics glad you found out... apologies, for not being able to help before. Seems that we need to reinforce new JsExpression() to the styles instead. I`ll add a note and will try to fix the docs whenever i have a bit more of free time.