Change map type to satelite in contact

GK User
Mon Dec 08, 2014 8:13 pm
Hi,

how can I change the maptype of the google maps in contact? Is there any documentation - I wasn't able to find anything - only outdated stuff.

Thanks
getimo
User avatar
Junior Boarder

GK User
Tue Dec 09, 2014 8:20 am
1. Please disable tinyMCE editor in global configuration (change editor to "editor - none").
2. Please go to Components->Contacts->Contacts and edit first contact. Change to Miscellaneous Information tab where you will find map configuration element.

Now what is important - how would you like to modify the map type?
User avatar
Moderator

GK User
Tue Dec 09, 2014 8:23 am
Additionally you could look into file:
/templates/gk_photo/js/gk.scripts.js
where map is generated basing on google maps js api.
User avatar
Moderator

GK User
Tue Dec 09, 2014 8:43 am
Thank you for your quick response. I'd like to have satellite view at zoom level 18 because there 45 degree images available for that location.

getimo
User avatar
Junior Boarder

GK User
Wed Dec 10, 2014 8:30 am
The zoom is defined by "data-zoom" parameter:
Code: Select all
<div class="gk-map static" data-latitude="-34.397" data-longitude="150.644" data-ui="yes" data-zoom="8"></div>
User avatar
Moderator

GK User
Wed Dec 10, 2014 9:50 am
I know that. But the title of this thread is about the mapTYPE --> satellite.

Can you tell me how to change that?
User avatar
Junior Boarder

GK User
Wed Dec 10, 2014 9:54 am
Please refer to google maps api documentation:
https://developers.google.com/maps/docu ... s#MapTypes
From what is written there, you should modify in gk.scripts.js where the map api is used:
Code: Select all
     var mapOptions = {
       scrollwheel: false,
       zoom: parseInt(map.data('zoom'), 10) || 12,
       center: mapCenters[i],
       panControl: map.data('ui') === 'yes' ? true : false,
       zoomControl: map.data('ui') === 'yes' ? true : false,
       scaleControl: map.data('ui') === 'yes' ? true : false,
       disableDefaultUI: map.data('ui') === 'yes' ? false : true,
       mapTypeControl: map.data('ui') === 'yes' ? true : false,
        mapTypeControlOptions: {
            style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
            position: google.maps.ControlPosition.TOP_CENTER
        }
     };

and add map type:
Code: Select all
   var mapOptions = {
      scrollwheel: false,
      zoom: parseInt(map.data('zoom'), 10) || 12,
      center: mapCenters[i],
      panControl: map.data('ui') === 'yes' ? true : false,
      zoomControl: map.data('ui') === 'yes' ? true : false,
      scaleControl: map.data('ui') === 'yes' ? true : false,
      disableDefaultUI: map.data('ui') === 'yes' ? false : true,
      mapTypeControl: map.data('ui') === 'yes' ? true : false,
      mapTypeId: google.maps.MapTypeId.SATELLITE,
      mapTypeControlOptions: {
         style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
         position: google.maps.ControlPosition.TOP_CENTER
      }
   };

After cache refresh satelite map type should show.
User avatar
Moderator

GK User
Wed Dec 10, 2014 9:55 am
Thank you very much!
User avatar
Junior Boarder

GK User
Mon Dec 21, 2015 3:46 pm
I saw that you have a post here that might help me alot.

I saw that for gk-map static there are many options. Is there an option to make a small label for the pin as well?
I'd like to show the map but with the labe as it is here: http://instante.gr/default.asp?cat_id=7

what params should I set in the contact to do that?

Thank you.
User avatar
Senior Boarder

GK User
Wed Dec 23, 2015 9:09 pm
Its just a google maps API. Please read its documentation and you can do anything that is allowed by googles API.
User avatar
Moderator


cron
Remember me
Register New Account
If you are old Gavick user, click HERE for steps to retrieve your account.