Tech Blog

Using Google Developers Charts to create a pie chart and bar graph with Alma Analytics and APIs

In this blog post we will show how it is possible to use Google Developers Charts to display visualizations of live data from Alma Analytics on a web site.   The access from Google developers Charts to the data from an Alma Analytics report is done via an API.

In the example here we will use two different Alma Analytics reports and display them in two different Google Charts:

  1. A pie chart
  2. A bar graph

(Note that there are many other visualizations, including a table, which can be presented via Google Developers Charts .  Here we will show only the pie chart and bar graph.)

The two Alma Analytics reports which we will use here are:

  1. Number of loans by library for previous 30 days = Lists the library name and number of loans from the Fulfillment subject area

First we will present pre-made html pages displaying the report “Number of loans by library for previous 30 days” in a pie chart and bar graph.  Then we will edit the pre-made html pages to display the second report ““.  The method which we will use to edit the pre-made html pages to display the second report can be used by the Alma institutions to display their own reports.

These are our two reports (as seen in the criteria tab of Alma Analytics):

In order to display the above reports in a Google Chart we will need to syntax to retrieve these reports via an API.  This is explained in blog post How to use an API to retrieve an Alma Analytics report in 5 easy steps .

The API to bring the first report “Number of loans by library for previous 30 days” is as follows (where of course 01234567890 should be changed to real API key):

https://api-eu.hosted.exlibrisgroup.com/almaws/v1/analytics/reports?path=%2Fshared%2FAlma%20University%2FReports%2FYoel%2FGoogle%20Charts%2FNumber%20of%20loans%20by%20library%20for%20previous%2030%20days&limit=25&col_names=false&apikey=01234567890

The two Google charts which we will use are:

The code of the Google charts above (Bar and Pie) were copied / downloaded from the above hyperlinked locations and then modified to be used by an Alma Analytics API.

The two modified files are as follows and can be downloaded here and modified for retrieving an Alma Analytics report in your institution:

When the above files have the correct API key and syntax they appear as follows in the Google developers Pie Chart and Bar Chart:

All you need to do is download the above html files with the “anonymized API key” and change the API call to the report to have the path and API key of your report.  Change this in the html file to point to your report:

https://api-eu.hosted.exlibrisgroup.com/almaws/v1/analytics/reports?path=%2Fshared%2FAlma%20University%2FReports%2FYoel%2FGoogle%20Charts%2FNumber%20of%20loans%20by%20library%20for%20previous%2030%20days&limit=25&col_names=true&apikey=01234567890

For example, now we will edit the html pages for the bar graph and pie chart to point to the second Alma Analytics report: ““.

So ….

In these html pages

After downloading we will

ONE

change this

https://api-eu.hosted.exlibrisgroup.com/almaws/v1/analytics/reports?path=%2Fshared%2FAlma%20University%2FReports%2FYoel%2FGoogle%20Charts%2FNumber%20of%20loans%20by%20library%20for%20previous%2030%20days&limit=25&col_names=true&apikey=01234567890

To this

https://api-eu.hosted.exlibrisgroup.com/almaws/v1/analytics/reports?path=%2Fshared%2FAlma%20University%2FReports%2FYoel%2FGoogle%20Charts%2FTop%20six%20link%20resolver%20usage%20sources%20for%20clicked%20requests%20in%20last%2012%20months&limit=25&col_names=false&apikey=01234567890

TWO

  • Change the text of the title “Number of loans by library for previous 30 days” to “Top six link resolver usage sources for clicked requests in last 12 months”
  • Change the text of the measure “Num. of loans” to “Num.” of clicked requests”
  • Change the text of the field “Library” to “Link Resolver Source”

THREE

For the bar graph will also change the size of the chart (not mandatory to have it work but may look nicer because now we have more columns than the previous version).  We will change the width from 800 to 1400.  Change this:

var options = {
‘title’:’Top six link resolver usage sources for clicked requests in last 12 months’,
‘width’:800,
‘height’:450
};

to this

var options = {
‘title’:’Top six link resolver usage sources for clicked requests in last 12 months’,
‘width’:1400,
‘height’:450
};

After these three simple changes we now have the new visualizations for the second Alma Analytics report.  Now we have these two new graphs:

These charts can now be placed on a web page of the library.

Leave a Reply