[Google Maps Library] Controls positions are not changing
Question
Forge component by Labs

Hi,

I need to move zoom controls to top right corner. Using this JSON it doesn't work (map style is applied but position of zoom buttons is the same).

SyntaxEditor Code Snippet

{'zoomControlOptions': [{'position':'google.maps.ControlPosition.RIGHT_TOP'}],'styles': [{'stylers': [{ 'saturation': -100 }]}]}


Thank you.

Solution

Hi Mykola,

Can you please try this:

 {
    panControl: true,
    panControlOptions: { position: google.maps.ControlPosition.TOP_RIGHT},
    zoomControl: true,
    zoomControlOptions: {position: google.maps.ControlPosition.TOP_RIGHT}
} 

Cheers,

GM


Hi Mykola.

Can you describe where / how are you using that JSON, in order to have more details to try to help you?


Hi Gonçalo,

it's on AdvancedOptions field on GoogleMaps/Maps widget.

 

Solution

Hi Mykola,

Can you please try this:

 {
    panControl: true,
    panControlOptions: { position: google.maps.ControlPosition.TOP_RIGHT},
    zoomControl: true,
    zoomControlOptions: {position: google.maps.ControlPosition.TOP_RIGHT}
} 

Cheers,

GM


Hi Gonçalo,

That worked! Thank you very much. However the styles part should have been used with  quotes and square brackets (other way seems not to work at all or end up in broken JSON parsing)

SyntaxEditor Code Snippet

"{panControl: true,
    panControlOptions: { position: google.maps.ControlPosition.TOP_RIGHT},
    zoomControl: true,
    zoomControlOptions: {position: google.maps.ControlPosition.TOP_RIGHT},
'fullscreenControl': false,'styles': [{'stylers': [{ 'saturation': -100 }]}]}"

Cheers

Mykola Tkachenko wrote:

Hi Gonçalo,

That worked! Thank you very much. However the styles part should have been used with  quotes and square brackets (other way seems not to work at all or end up in broken JSON parsing)

SyntaxEditor Code Snippet

"{panControl: true,
    panControlOptions: { position: google.maps.ControlPosition.TOP_RIGHT},
    zoomControl: true,
    zoomControlOptions: {position: google.maps.ControlPosition.TOP_RIGHT},
'fullscreenControl': false,'styles': [{'stylers': [{ 'saturation': -100 }]}]}"

Cheers

Hi Mykola,

Nice to know it helped.

Sorry, but I thought that your issue was only with the position.

Cheers,

GM


Thanks for your notification  and I appreciate  it. 

Hi Gonçalo,

The issue was with position that's right. It is just a bit strange to use different "syntax styling" inside one AdvancedOptions field with and without quotes (and in description the example has single quotes for strings) and also square brackets for nested options. It would be nice to have that consistent to avoid trying every possible syntax.


Cheers,
Nick

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.