Scribd
Upload
80 views

Step-By-Step Google Map API v3 Integration

This document provides step-by-step instructions for integrating Google Maps into a visualization. It includes code snippets for defining necessary variables like the Google Maps API key and variables for calculating zoom level and center point. It also explains how to configure a scatter chart to plot location data and link it to the Google Maps image.

Uploaded by

diitris
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
80 views

Step-By-Step Google Map API v3 Integration

This document provides step-by-step instructions for integrating Google Maps into a visualization. It includes code snippets for defining necessary variables like the Google Maps API key and variables for calculating zoom level and center point. It also explains how to configure a scatter chart to plot location data and link it to the Google Maps image.

Uploaded by

diitris
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 13

Step-by-Step Google Map integration

1. Code to be added to the script:


// Google Maps Key
// get a key here http://code.google.com/apis/maps/signup.html
// gmap_key = 'xx';
max_zoom_level = 17; //maximum value 17
// Variables required for calculating map
// No need to change these
var_pi180=
'=pi()/180';
var_lat_offset=
'0';
var_mc2=
'=256*pow(2,$(var_zoom))';
var_mc1=
'=256*pow(2,($(var_zoom)-1))';
var_mid_lat= '=min(Latitude)+(1+var_lat_offset)*((max(Latitude)-min(Latitude))/2)';
var_mid_long= '=min(Longitude)+(max(Longitude)-min(Longitude))/2';
var_zoom=
'=max(aggr(if(max( round(256*pow(2,(_zoom_level -1)))+(
Longitude *((256*pow(2,_zoom_level ))/360)) )-min( round(256*pow(2,(_zoom_level 1)))+( Longitude *((256*pow(2,_zoom_level ))/360)) ) <map_size_x AND
max((256*pow(2,(_zoom_level-1)))+((0.5*log((1+(sin((Latitude)*pi()/180)))/(1(sin((Latitude)*pi()/180)))))*((-256*pow(2,_zoom_level))/(2*pi()))))min((256*pow(2,(_zoom_level-1)))+((0.5*log((1+(sin((Latitude)*pi()/180)))/(1(sin((Latitude)*pi()/180)))))*((256*pow(2,_zoom_level))/(2*pi()))))<map_size_y,_zoom_level,1),_zoom_level))';
var_maptype= '=if(isnull(only(maptype)),fieldvalue( '&chr(39)&'maptype'&chr(39)&',
1 ),maptype)';
map_size_x=
'640';
map_size_y=
'400';
SET HidePrefix='_' ;
// Field required for calcualting best zoom level
_zoom_level:
Load RecNo( ) as _zoom_level autogenerate(max_zoom_level);
maptype:
LOAD * INLINE [
maptype
roadmap
mobile
satellite
terrain
hybrid
];
set hideprefix = 'maptype';

2. Add and configure a scatter chart:

=> NEXT

This defines the dots which will be plotted (Customers in that example).
=> NEXT

Click on Finish and exit the wizard.

Longitude:
=sum( round (256*pow(2,($(var_zoom)-1)))+( Longitude *((256*pow(2,$(var_zoom)))/360)))

Background color:
=argb(150,178,36,36)

Latitude:
=sum(((256*pow(2,($(var_zoom)-1)))+((0.5*log((1+(sin((Latitude)*pi()/180)))/(1-(sin((Latitude)*pi()/180)))))*((256*pow(2,$(var_zoom)))/(2*pi())))))

That value can be anything; it will control the size of the dots (Net Sales in that example).

X axis:
Static Min:
=(256*pow(2,($(var_zoom)-1)))+( var_mid_long *((256*pow(2,$(var_zoom)))/360)) -round(map_size_x/2)
Static Max:
=( (256*pow(2,($(var_zoom)-1)))+( var_mid_long *((256*pow(2,$(var_zoom)))/360)) + round(map_size_x/2))

Y axis:
Static Min:
=((256*pow(2,($(var_zoom)-1)))+((0.5*log((1+(sin(var_mid_lat*pi()/180)))/(1-(sin(var_mid_lat*pi()/180)))))*((256*pow(2,$(var_zoom)))/(2*pi())))+round(map_size_y/2))
Static Max:
=((256*pow(2,($(var_zoom)-1)))+((0.5*log((1+(sin(var_mid_lat*pi()/180)))/(1-(sin(var_mid_lat*pi()/180)))))*((256*pow(2,$(var_zoom)))/(2*pi())))-round(map_size_y/2))

10

Dynamic Image:
='http://maps.google.com/staticmap?center='
&
num(var_mid_lat, '##############', '.', ',' )
&
','
&
num(var_mid_long, '##############', '.', ',' )
&
'&zoom=$(var_zoom)'
&
'&maptype='&var_maptype
&
'&size='&map_size_x&'x'&map_size_y
&
'&key='&gmap_key & '&.jpg'

11

Size of the chart, according to map_size_x and map_size_y (defined in the script).

12

Result:

13

You might also like