CODEWITHSUNDEEP
google-mapsgoogle-analyticsgoogle-visualizationgoogle-analytics-apiapi-key
Sadia
Sadia

Reputation: 43

Set API key with embed API google analytics

I was rending map with my google analytics data using embed api as: 


    (function(w,d,s,g,js,fs){
      g=w.gapi||(w.gapi={});g.analytics={q:[],ready:function(f){this.q.push(f);}};
      js=d.createElement(s);fs=d.getElementsByTagName(s)[0];
      js.src='https://apis.google.com/js/platform.js';
      fs.parentNode.insertBefore(js,fs);js.onload=function(){g.load('analytics');};
    }(window,document,'script'));

    gapi.analytics.auth.authorize({
       serverAuth: {
           access_token: 'my access token' 
        }
    )};

    var commonConfig2 = {
       query: {
           ids: 'ga:' + gaViewId,
           metrics: 'ga:users',
           dimensions: 'ga:region',
           'max-results': 5,
           sort : '-ga:users'   
        },
           chart: {
           type: 'GEO',
           container: 'timeline',
           options: {
              displayMode: 'markers',
              width: '100%' 
           }
        }
    };

    var dataChart3 = new gapi.analytics.googleCharts.DataChart(commonConfig2)
          .set({query: dateRange1})
          .set({chart: {container: 'chart-3-container'}});

Map was rendering fine. But few days back i got error "Google Maps API error: MissingKeyMapError" and map is no longer rending. After some googling i came to know that google now require Api key to access its api. How can i set api key with my existing code.

Upvotes: 3

Views: 972

Answers (2)

guari
guari

Reputation: 3820

I noticed the same issue today, after many attemps and no documentation I've got it working again!

Here is what you need to do:

  1. Go to https://console.developers.google.com, select your project and enable on it the Google Maps Geocoding API and the Google Maps JavaScript API (for the second one, keep note of the API_KEY and set your allowed referrer urls);

  2. In your sources, ensure to import the following scripts:

    <script src="https://www.google.com/jsapi"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=API_KEY"></script>

That's all, now your Embed API maps will restart to draw the location data with no errors or warnings. It would be better if that was written on Google Analytics Embed API documentation (as of now, it has been also removed the map sample on the website)

Upvotes: 4

Linda Lawton - DaImTo
Linda Lawton - DaImTo

Reputation: 117146

This took a little emailing back and forth with the team at Google.

It appears that the Maps API has changed and now requires that you send an key to access it.

The embedded API was not designed to allow you to send a key it assumed that one was not needed.

Status: At this time no one is working on the Embedded API and the code for it is not open source. Maps in the Embedded API are broken until further notice. My Google contact was unable to tell me when or if it would be fixed in the future.

Upvotes: 3

Related Questions