Index: modules/open-science-observatory-ui/trunk/src/app/pages/countrypage/country-page.component.html
===================================================================
--- modules/open-science-observatory-ui/trunk/src/app/pages/countrypage/country-page.component.html	(revision 58852)
+++ modules/open-science-observatory-ui/trunk/src/app/pages/countrypage/country-page.component.html	(revision 58853)
@@ -2,26 +2,37 @@
   <div class="uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up uk-padding-remove" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}">
   <!--<div class="uk-container uk-container-expand uk-container-center uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up uk-padding-remove" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}">-->
 
-
     <div class="uk-grid uk-grid-small">
 
       <div class="uk-width-4-5 uk-margin-medium-bottom">
 
         <div class="uk-container uk-container-expand uk-margin-medium-top">
+
           <ul class="uk-breadcrumb">
             <li><a [routerLink]="['/home']">Home</a></li>
             <li><span>{{countryName}}</span></li>
           </ul>
-        </div>
 
-        <div class="uk-container uk-container-expand uk-margin-top">
-          <div class="actionButtonsCountryPage uk-text-right">
-            <a class=""><i class="fas fa-code uk-margin-small-right"></i>Embed</a>
-            <!--<a class="uk-margin-left"><i class="fas fa-download uk-margin-small-right"></i>Download CSV</a>-->
-            <a class="uk-margin-left"><i class="fas fa-file-pdf uk-margin-small-right"></i>Download PDF</a>
+
+          <div class="countryPageHeader">
+            <div *ngIf="countryPageOverviewData && countryPageOverviewData.name" class="">
+              <img src="../../../assets/img/flags/{{countryCode | lowercase}}-flag-round.png" class="flag-image" width="132" height="132">
+              <div class="uk-inline uk-margin-left">
+                <h1>{{countryPageOverviewData.name}}</h1>
+                <span class="lastUpdateInfo">Info Last Updated: 21 May 2020</span>
+              </div>
+            </div>
+
+            <div class="actionButtonsCountryPage uk-text-right">
+              <a class=""><i class="fas fa-code uk-margin-small-right"></i>Embed</a>
+              <!--<a class="uk-margin-left"><i class="fas fa-download uk-margin-small-right"></i>Download CSV</a>-->
+              <a class="uk-margin-left"><i class="fas fa-file-pdf uk-margin-small-right"></i>Download PDF</a>
+            </div>
           </div>
+
         </div>
 
+
         <div class="uk-container uk-container-expand uk-margin-top">
           <!--Overview cards-->
           <div class="uk-width-1-1 indicatorCards">
@@ -34,21 +45,21 @@
 
                     <!--top number-->
                     <div class="uk-margin-top">
-                      <div class="uk-float-right uk-margin-small-right">
-                        <img src="../../../assets/img/icons/publications-icon.svg" width="40" height="40">
-                      </div>
+                      <!--<div class="uk-float-right uk-margin-small-right">-->
+                      <!--<img src="../../../assets/img/icons/publications-icon.svg" width="40" height="40">-->
+                      <!--</div>-->
                       <h3 class="uk-margin-remove">
-                        <span *ngIf="!countryData || !countryData.publications || !countryData.publications.oa" class="number">--</span>
-                        <span *ngIf="countryData?.publications?.oa" class="number">{{countryData.publications.oa | number}}</span>
+                        <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.publicationsAffiliated || !countryPageOverviewData.publicationsAffiliated.oa" class="number">--</span>
+                        <span *ngIf="countryPageOverviewData?.publicationsAffiliated?.oa" class="number">{{countryPageOverviewData.publicationsAffiliated.oa | number}}</span>
                       </h3>
                     </div>
                     <div class="uk-margin-top">
-                      <span class=""><i>OA publications from institutional repositories</i></span>
+                      <span class=""><i>OA publications affiliated to an organization in the country</i></span>
                     </div>
-                    <div *ngIf="countryData?.publications?.percentage" class="uk-margin-top">
-                      <span class="number">{{countryData.publications.percentage | number :'1.0-1'}}%</span> OA
+                    <div *ngIf="countryPageOverviewData?.publicationsAffiliated?.percentage" class="uk-margin-top">
+                      <span class="number">{{countryPageOverviewData.publicationsAffiliated.percentage | number :'1.0-1'}}%</span> OA
                       <div class="progress uk-margin-small-top">
-                        <div [ngStyle]="{'width': countryData.publications.percentage+'%'}" class="progress-bar progress-bar-publications animate-progress-bar"></div>
+                        <div [ngStyle]="{'width': countryPageOverviewData.publicationsAffiliated.percentage+'%'}" class="progress-bar progress-bar-publications animate-progress-bar"></div>
                       </div>
                     </div>
 
@@ -56,23 +67,24 @@
 
                     <!--bottom number-->
                     <div class="uk-margin-top">
-                      <!--<div class="uk-float-right uk-margin-small-right">-->
-                        <!--<img src="../../../assets/img/icons/publications-icon.svg" width="40" height="40">-->
-                      <!--</div>-->
+                      <div class="uk-float-right uk-margin-small-right">
+                        <img src="../../../assets/img/icons/publications-icon.svg" width="40" height="40">
+                      </div>
                       <h3 class="uk-margin-remove">
-                        <span *ngIf="!countryData || !countryData.publications || !countryData.publications.oa" class="number">--</span>
-                        <span *ngIf="countryData?.publications?.oa" class="number">{{countryData.publications.oa | number}}</span>
+                        <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.publicationsDeposited || !countryPageOverviewData.publicationsDeposited.oa" class="number">--</span>
+                        <span *ngIf="countryPageOverviewData?.publicationsDeposited?.oa" class="number">{{countryPageOverviewData.publicationsDeposited.oa | number}}</span>
                       </h3>
                     </div>
                     <div class="uk-margin-top">
-                      <span class=""><i>OA publications affiliated to an organization in the country</i></span>
+                      <span class=""><i>OA publications from institutional repositories</i></span>
                     </div>
-                    <div *ngIf="countryData?.publications?.percentage" class="uk-margin-top">
-                      <span class="number">{{countryData.publications.percentage | number :'1.0-1'}}%</span> OA
+                    <div *ngIf="countryPageOverviewData?.publicationsDeposited?.percentage" class="uk-margin-top">
+                      <span class="number">{{countryPageOverviewData.publicationsDeposited.percentage | number :'1.0-1'}}%</span> OA
                       <div class="progress uk-margin-small-top">
-                        <div [ngStyle]="{'width': countryData.publications.percentage+'%'}" class="progress-bar progress-bar-publications animate-progress-bar"></div>
+                        <div [ngStyle]="{'width': countryPageOverviewData.publicationsDeposited.percentage+'%'}" class="progress-bar progress-bar-publications animate-progress-bar"></div>
                       </div>
                     </div>
+
                   </div>
                 </div>
               </div>
@@ -83,21 +95,21 @@
 
                     <!--top number-->
                     <div class="uk-margin-top">
-                      <div class="uk-float-right uk-margin-small-right">
-                        <img src="../../../assets/img/icons/datasets-icon.svg" width="33" height="40">
-                      </div>
+                      <!--<div class="uk-float-right uk-margin-small-right">-->
+                      <!--<img src="../../../assets/img/icons/datasets-icon.svg" width="33" height="40">-->
+                      <!--</div>-->
                       <h3 class="uk-margin-remove">
-                        <span *ngIf="!countryData || !countryData.datasets || !countryData.datasets.oa" class="number">--</span>
-                        <span *ngIf="countryData?.datasets?.oa" class="number">{{countryData.datasets.oa | number}}</span>
+                        <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.datasetsAffiliated || !countryPageOverviewData.datasetsAffiliated.oa" class="number">--</span>
+                        <span *ngIf="countryPageOverviewData?.datasetsAffiliated?.oa" class="number">{{countryPageOverviewData.datasetsAffiliated.oa | number}}</span>
                       </h3>
                     </div>
                     <div class="uk-margin-top">
-                      <span class=""><i>OA datasets from institutional repositories</i></span>
+                      <span class=""><i>OA datasets affiliated to an organization in the country</i></span>
                     </div>
-                    <div *ngIf="countryData?.datasets?.percentage" class="uk-margin-top">
-                      <span class="number">{{countryData.datasets.percentage | number :'1.0-1'}}%</span> OA
+                    <div *ngIf="countryPageOverviewData?.datasetsAffiliated?.percentage" class="uk-margin-top">
+                      <span class="number">{{countryPageOverviewData.datasetsAffiliated.percentage | number :'1.0-1'}}%</span> OA
                       <div class="progress uk-margin-small-top">
-                        <div [ngStyle]="{'width': countryData.datasets.percentage+'%'}" class="progress-bar progress-bar-datasets animate-progress-bar"></div>
+                        <div [ngStyle]="{'width': countryPageOverviewData.datasetsAffiliated.percentage+'%'}" class="progress-bar progress-bar-datasets animate-progress-bar"></div>
                       </div>
                     </div>
 
@@ -105,21 +117,21 @@
 
                     <!--bottom number-->
                     <div class="uk-margin-top">
-                      <!--<div class="uk-float-right uk-margin-small-right">-->
-                        <!--<img src="../../../assets/img/icons/datasets-icon.svg" width="33" height="40">-->
-                      <!--</div>-->
+                      <div class="uk-float-right uk-margin-small-right">
+                        <img src="../../../assets/img/icons/datasets-icon.svg" width="33" height="40">
+                      </div>
                       <h3 class="uk-margin-remove">
-                        <span *ngIf="!countryData || !countryData.datasets || !countryData.datasets.oa" class="number">--</span>
-                        <span *ngIf="countryData?.datasets?.oa" class="number">{{countryData.datasets.oa | number}}</span>
+                        <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.datasetsDeposited || !countryPageOverviewData.datasetsDeposited.oa" class="number">--</span>
+                        <span *ngIf="countryPageOverviewData?.datasetsDeposited?.oa" class="number">{{countryPageOverviewData.datasetsDeposited.oa | number}}</span>
                       </h3>
                     </div>
                     <div class="uk-margin-top">
-                      <span class=""><i>OA datasets affiliated to an organization in the country</i></span>
+                      <span class=""><i>OA datasets from institutional repositories</i></span>
                     </div>
-                    <div *ngIf="countryData?.datasets?.percentage" class="uk-margin-top">
-                      <span class="number">{{countryData.datasets.percentage | number :'1.0-1'}}%</span> OA
+                    <div *ngIf="countryPageOverviewData?.datasetsDeposited?.percentage" class="uk-margin-top">
+                      <span class="number">{{countryPageOverviewData.datasetsDeposited.percentage | number :'1.0-1'}}%</span> OA
                       <div class="progress uk-margin-small-top">
-                        <div [ngStyle]="{'width': countryData.datasets.percentage+'%'}" class="progress-bar progress-bar-datasets animate-progress-bar"></div>
+                        <div [ngStyle]="{'width': countryPageOverviewData.datasetsDeposited.percentage+'%'}" class="progress-bar progress-bar-datasets animate-progress-bar"></div>
                       </div>
                     </div>
                   </div>
@@ -135,17 +147,17 @@
                         <img src="../../../assets/img/icons/repositories-icon.svg" width="43" height="40">
                       </div>
                       <h3 class="uk-margin-remove">
-                        <span *ngIf="!countryData || !countryData.repositories || !countryData.repositories.oa" class="number">--</span>
-                        <span *ngIf="countryData?.repositories?.oa" class="number">{{countryData.repositories.oa | number}}</span>
+                        <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.repositories || !countryPageOverviewData.repositories.oa" class="number">--</span>
+                        <span *ngIf="countryPageOverviewData?.repositories?.oa" class="number">{{countryPageOverviewData.repositories.oa | number}}</span>
                       </h3>
                     </div>
                     <div class="uk-margin-top">
                       <span class=""><i>repositories</i> from openDOAR & re3data</span>
                     </div>
-                    <div *ngIf="countryData?.repositories?.percentage" class="uk-margin-top">
-                      <span class="number">{{countryData.repositories.percentage | number :'1.0-1'}}%</span> Certified
+                    <div *ngIf="countryPageOverviewData?.repositories?.percentage" class="uk-margin-top">
+                      <span class="number">{{countryPageOverviewData.repositories.percentage | number :'1.0-1'}}%</span> Validated
                       <div class="progress uk-margin-small-top">
-                        <div [ngStyle]="{'width': countryData.repositories.percentage+'%'}" class="progress-bar progress-bar-repositories animate-progress-bar"></div>
+                        <div [ngStyle]="{'width': countryPageOverviewData.repositories.percentage+'%'}" class="progress-bar progress-bar-repositories animate-progress-bar"></div>
                       </div>
                     </div>
                   </div>
@@ -158,8 +170,8 @@
                         <img src="../../../assets/img/icons/journals-icon.svg" width="43" height="40">
                       </div>
                       <h3 class="uk-margin-remove">
-                        <span *ngIf="!countryData || !countryData.journals || !countryData.journals.oa" class="number">--</span>
-                        <span *ngIf="countryData?.journals?.oa" class="number">{{countryData.journals.oa | number}}</span>
+                        <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.journals || !countryPageOverviewData.journals.oa" class="number">--</span>
+                        <span *ngIf="countryPageOverviewData?.journals?.oa" class="number">{{countryPageOverviewData.journals.oa | number}}</span>
                         <!--<span *ngIf="overviewData.overview.journals?.oa" class="number">{{overviewData.overview.journals.oa | number}}</span>-->
                         <!--<span *ngIf="!overviewData.overview.journals || !overviewData.overview.journals.oa" class="number">--</span>-->
                       </h3>
@@ -167,10 +179,10 @@
                     <div class="uk-margin-top">
                       <span class=""><i>OA journals</i> from DOAJ</span>
                     </div>
-                    <div *ngIf="countryData.journals?.percentage" class="uk-margin-top">
-                      <span class="number">{{countryData.journals.percentage | number :'1.0-1'}}%</span> Certified
+                    <div *ngIf="countryPageOverviewData?.journals?.percentage" class="uk-margin-top">
+                      <span class="number">{{countryPageOverviewData.journals.percentage | number :'1.0-1'}}%</span> Validated
                       <div class="progress uk-margin-small-top">
-                        <div [ngStyle]="{'width': countryData.journals.percentage+'%'}" class="progress-bar progress-bar-journals animate-progress-bar"></div>
+                        <div [ngStyle]="{'width': countryPageOverviewData.journals.percentage+'%'}" class="progress-bar progress-bar-journals animate-progress-bar"></div>
                       </div>
                     </div>
                   </div>
@@ -503,7 +515,7 @@
 
           <div class="md-card-toolbar">
             <h3 class="uk-text-center uk-margin-small-top">
-              {{countryName | uppercase}}
+              Research overview
             </h3>
           </div>
 
@@ -518,8 +530,8 @@
               <hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
 
               <div class="indicator">
-                <span class="number primary" *ngIf="countryData?.funders?.oa">{{countryData.funders.oa}}</span>
-                <span class="number primary" *ngIf="!countryData || !countryData.funders || !countryData.funders.oa">--</span>
+                <span class="number primary" *ngIf="countryPageOverviewData?.funders">{{countryPageOverviewData.funders}}</span>
+                <span class="number primary" *ngIf="!countryPageOverviewData || !countryPageOverviewData.funders">--</span>
                 <span><i>funding sources</i></span>
               </div>
 
@@ -526,8 +538,8 @@
               <hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
 
               <div class="indicator">
-                <span class="number primary" *ngIf="countryData?.funders?.total">{{countryData.funders.total}}</span>
-                <span class="number primary" *ngIf="!countryData || !countryData.funders || !countryData.funders.total">--</span>
+                <span class="number primary" *ngIf="countryPageOverviewData?.fundingOrganizations">{{countryPageOverviewData.fundingOrganizations}}</span>
+                <span class="number primary" *ngIf="!countryPageOverviewData || !countryPageOverviewData.fundingOrganizations">--</span>
                 <span><i>funding organizations</i></span>
               </div>
 
@@ -534,8 +546,8 @@
               <hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
 
               <div class="indicator">
-                <span class="number primary" *ngIf="countryData?.ecFundedOrganizations?.oa">{{countryData.ecFundedOrganizations.oa}}</span>
-                <span class="number primary" *ngIf="!countryData || !countryData.ecFundedOrganizations || !countryData.ecFundedOrganizations.oa">--</span>
+                <span class="number primary" *ngIf="countryPageOverviewData?.ec_fundedOrganizations">{{countryPageOverviewData.ec_fundedOrganizations}}</span>
+                <span class="number primary" *ngIf="!countryPageOverviewData || !countryPageOverviewData.ec_fundedOrganizations">--</span>
                 <span><i>organizations funded by the European commission since 2013</i></span>
               </div>
 
@@ -552,13 +564,6 @@
               <a class="uk-link" href="{{linkToCountryInOpenAIRE}}" target="_blank">Country page in <strong>OpenAIRE</strong><i class="fas fa-long-arrow-alt-right uk-margin-left"></i></a>
             </div>
 
-            <div class="uk-text-meta uk-text-small uk-margin-medium-top">
-                <span class="uk-margin-right" style="opacity: 0.8; float: left; margin-top: 7px;">
-                  <img src="../../../assets/img/Open_Research_Graph.svg">
-                </span>
-              <span>Powered by <a target="_blank" href="" style="text-decoration: underline">OpenAIRE Open Research Graph</a></span>
-            </div>
-
           </div>
         </div>
       </div>
Index: modules/open-science-observatory-ui/trunk/src/app/pages/countrypage/country-page.component.ts
===================================================================
--- modules/open-science-observatory-ui/trunk/src/app/pages/countrypage/country-page.component.ts	(revision 58852)
+++ modules/open-science-observatory-ui/trunk/src/app/pages/countrypage/country-page.component.ts	(revision 58853)
@@ -1,22 +1,24 @@
-import { Component, OnInit, ViewEncapsulation } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { DataService } from '../../services/data.service';
 import { ActivatedRoute } from '@angular/router';
 import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
 import { CountryOverview, OverviewData } from '../../domain/overview-data';
+import { DataHandlerService } from '../../services/data-handler.service';
+import { CountryPageOverviewData } from '../../domain/overview-map-data';
 
 @Component({
   selector: 'app-country-page',
   templateUrl: './country-page.component.html',
-  // styleUrls: ['./top-menu.component.css'],
-  encapsulation: ViewEncapsulation.None
 })
 
 export class CountryPageComponent implements OnInit {
 
-  countryName: string;
+  countryCode: string;
 
   linkToCountryInOpenAIRE: string;
 
+  countryPageOverviewData: CountryPageOverviewData;
+
   greenGoldLineChartURL: SafeResourceUrl;
   goldOrganisationsChartURL: SafeResourceUrl;
   greenOrganisationsChartURL: SafeResourceUrl;
@@ -31,42 +33,58 @@
   overviewData: OverviewData;
   countryData: CountryOverview;
 
-  // countrySelectedName: string = null;
 
   constructor(private dataService: DataService,
+              private dataHandlerService: DataHandlerService,
               private route: ActivatedRoute,
               private sanitizer: DomSanitizer) { }
 
   ngOnInit(): void {
 
-    window.scroll(0,0);
+    window.scroll(0, 0);
 
-    this.countryName = this.route.snapshot.paramMap.get('countryName');
-    this.linkToCountryInOpenAIRE = 'https://www.openaire.eu/item/' + this.countryName.replace(' ', '-');
+    this.countryCode = this.route.snapshot.paramMap.get('countryCode');
 
-    this.dataService.getCountryData(this.countryName).subscribe(
-      overviewData => {
-        this.overviewData = overviewData;
-        this.countryData = this.overviewData.countries.filter(x => x.country === this.countryName)[0];
-      },
-      error => {
+    this.dataService.getCountryPageOverviewData(this.countryCode).subscribe(
+      rawData => {
+        this.countryPageOverviewData = this.dataHandlerService.convertRawDataToCountryPageOverviewData(rawData);
+        if (this.countryPageOverviewData && this.countryPageOverviewData.name) {
+          this.linkToCountryInOpenAIRE = 'https://www.openaire.eu/item/' + this.countryPageOverviewData.name.replace(' ', '-');
+          this.createChartURLs();
+        }
+      }, error => {
         console.log(error);
       }
     );
+    // this.linkToCountryInOpenAIRE = 'https://www.openaire.eu/item/' + this.countryName.replace(' ', '-');
 
+    // this.dataService.getCountryData(this.countryName).subscribe(
+    //   overviewData => {
+    //     this.overviewData = overviewData;
+    //     this.countryData = this.overviewData.countries.filter(x => x.country === this.countryName)[0];
+    //   },
+    //   error => {
+    //     console.log(error);
+    //   }
+    // );
 
+
+
+  }
+
+  createChartURLs() {
     // green: #98A886,  gold: #D3BF3B
-    this.greenGoldLineChartURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Green%20OA%22%2C%22type%22%3A%22line%22%2C%22query%22%3A%7B%22name%22%3A%22oso.green.year.` + this.countryName.replace(' ', '') + `%22%7D%7D%2C%7B%22name%22%3A%22Gold%20OA%22%2C%22type%22%3A%22line%22%2C%22query%22%3A%7B%22name%22%3A%22oso.gold.year.` + this.countryName.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Green%20vs%20Gold%20Publications%22%7D%2C%22subtitle%22%3A%7B%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22publications%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22year%22%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Atrue%2C%22align%22%3A%22center%22%2C%22verticalAlign%22%3A%22bottom%22%2C%22layout%22%3A%22horizontal%22%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%2C%22colors%22%3A%5B%22%2398A886%22%2C%22%23D3BF3B%22%2C%22%232f7ed8%22%2C%22%230d233a%22%2C%22%238bbc21%22%2C%22%23910000%22%2C%22%231aadce%22%2C%22%23492970%22%2C%22%23f28f43%22%2C%22%2377a1e5%22%2C%22%23c42525%22%2C%22%23a6c96a%22%5D%7D%7D`);
-    this.goldOrganisationsChartURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Gold%20OA%22%2C%22type%22%3A%22bar%22%2C%22color%22%3A%22%23D3BF3B%22%2C%22query%22%3A%7B%22name%22%3A%22oso.gold.organization.` + this.countryName.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Gold%20Open%20Access%22%7D%2C%22subtitle%22%3A%7B%22text%22%3A%22Top%2015%20Organizations%22%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22Publications%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22Organizations%22%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Atrue%2C%22align%22%3A%22center%22%2C%22verticalAlign%22%3A%22bottom%22%2C%22layout%22%3A%22horizontal%22%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%7D%7D`);
-    this.greenOrganisationsChartURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Green%20OA%22%2C%22type%22%3A%22bar%22%2C%22color%22%3A%22%2398A886%22%2C%22query%22%3A%7B%22name%22%3A%22oso.green.organization.` + this.countryName.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Green%20Open%20Access%22%7D%2C%22subtitle%22%3A%7B%22text%22%3A%22Top%2015%20Organizations%22%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22Publications%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22Organizations%22%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Atrue%2C%22align%22%3A%22center%22%2C%22verticalAlign%22%3A%22bottom%22%2C%22layout%22%3A%22horizontal%22%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%7D%7D`);
+    this.greenGoldLineChartURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Green%20OA%22%2C%22type%22%3A%22line%22%2C%22query%22%3A%7B%22name%22%3A%22oso.green.year.` + this.countryPageOverviewData.name.replace(' ', '') + `%22%7D%7D%2C%7B%22name%22%3A%22Gold%20OA%22%2C%22type%22%3A%22line%22%2C%22query%22%3A%7B%22name%22%3A%22oso.gold.year.` + this.countryPageOverviewData.name.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Green%20vs%20Gold%20Publications%22%7D%2C%22subtitle%22%3A%7B%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22publications%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22year%22%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Atrue%2C%22align%22%3A%22center%22%2C%22verticalAlign%22%3A%22bottom%22%2C%22layout%22%3A%22horizontal%22%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%2C%22colors%22%3A%5B%22%2398A886%22%2C%22%23D3BF3B%22%2C%22%232f7ed8%22%2C%22%230d233a%22%2C%22%238bbc21%22%2C%22%23910000%22%2C%22%231aadce%22%2C%22%23492970%22%2C%22%23f28f43%22%2C%22%2377a1e5%22%2C%22%23c42525%22%2C%22%23a6c96a%22%5D%7D%7D`);
+    this.goldOrganisationsChartURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Gold%20OA%22%2C%22type%22%3A%22bar%22%2C%22color%22%3A%22%23D3BF3B%22%2C%22query%22%3A%7B%22name%22%3A%22oso.gold.organization.` + this.countryPageOverviewData.name.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Gold%20Open%20Access%22%7D%2C%22subtitle%22%3A%7B%22text%22%3A%22Top%2015%20Organizations%22%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22Publications%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22Organizations%22%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Atrue%2C%22align%22%3A%22center%22%2C%22verticalAlign%22%3A%22bottom%22%2C%22layout%22%3A%22horizontal%22%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%7D%7D`);
+    this.greenOrganisationsChartURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Green%20OA%22%2C%22type%22%3A%22bar%22%2C%22color%22%3A%22%2398A886%22%2C%22query%22%3A%7B%22name%22%3A%22oso.green.organization.` + this.countryPageOverviewData.name.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Green%20Open%20Access%22%7D%2C%22subtitle%22%3A%7B%22text%22%3A%22Top%2015%20Organizations%22%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22Publications%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22Organizations%22%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Atrue%2C%22align%22%3A%22center%22%2C%22verticalAlign%22%3A%22bottom%22%2C%22layout%22%3A%22horizontal%22%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%7D%7D`);
     // publications: #19647E, datasets: #019A85, software: #99B2DD
-    this.publicationsDataSetsSoftwareByYearGraphURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Publications%22%2C%22type%22%3A%22line%22%2C%22query%22%3A%7B%22name%22%3A%22oso.oapublications.` + this.countryName.replace(' ', '') + `%22%7D%7D%2C%7B%22name%22%3A%22Datasets%22%2C%22type%22%3A%22line%22%2C%22query%22%3A%7B%22name%22%3A%22oso.oadatasets.` + this.countryName.replace(' ', '') + `%22%7D%7D%2C%7B%22name%22%3A%22Software%22%2C%22type%22%3A%22line%22%2C%22query%22%3A%7B%22name%22%3A%22oso.oasoftwares.` + this.countryName.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Publications%20vs%20Datasets%20vs%20Software%22%7D%2C%22subtitle%22%3A%7B%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22somethings%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Atrue%2C%22align%22%3A%22center%22%2C%22verticalAlign%22%3A%22bottom%22%2C%22layout%22%3A%22horizontal%22%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%2C%22colors%22%3A%5B%22%2319647E%22%2C%22%23019A85%22%2C%22%2399B2DD%22%2C%22%232f7ed8%22%2C%22%230d233a%22%2C%22%238bbc21%22%2C%22%23910000%22%2C%22%231aadce%22%2C%22%23492970%22%2C%22%23f28f43%22%2C%22%2377a1e5%22%2C%22%23c42525%22%2C%22%23a6c96a%22%5D%7D%7D`);
-    this.publicationsDataSetsSoftwareByFunderGraphURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Publications%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22name%22%3A%22oso.oapublications.funder.` + this.countryName.replace(' ', '') + `%22%7D%7D%2C%7B%22name%22%3A%22Datasets%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22name%22%3A%22oso.oadatasets.funder.` + this.countryName.replace(' ', '') + `%22%7D%7D%2C%7B%22name%22%3A%22Software%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22name%22%3A%22oso.oasoftwares.funder.` + this.countryName.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Publications%20vs%20Datasets%20vs%20Software%22%7D%2C%22subtitle%22%3A%7B%22text%22%3A%22by%20funder%22%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22somethings%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22funder%22%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Atrue%2C%22align%22%3A%22center%22%2C%22verticalAlign%22%3A%22bottom%22%2C%22layout%22%3A%22horizontal%22%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%2C%22colors%22%3A%5B%22%2319647E%22%2C%22%23019A85%22%2C%22%2399B2DD%22%2C%22%232f7ed8%22%2C%22%230d233a%22%2C%22%238bbc21%22%2C%22%23910000%22%2C%22%231aadce%22%2C%22%23492970%22%2C%22%23f28f43%22%2C%22%2377a1e5%22%2C%22%23c42525%22%2C%22%23a6c96a%22%5D%7D%7D`);
-    this.topProjectsByPublicationsGraphURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Publications%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22name%22%3A%22oso.top10.projects.publications.` + this.countryName.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Top%2010%20Projects%22%7D%2C%22subtitle%22%3A%7B%22text%22%3A%22by%20publications%22%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22publications%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22projects%22%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Afalse%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%2C%22colors%22%3A%5B%22%2319647E%22%2C%22%232f7ed8%22%2C%22%230d233a%22%2C%22%238bbc21%22%2C%22%23910000%22%2C%22%231aadce%22%2C%22%23492970%22%2C%22%23f28f43%22%2C%22%2377a1e5%22%2C%22%23c42525%22%2C%22%23a6c96a%22%5D%7D%7D`);
-    this.topProjectsByDatasetsGraphURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Datasets%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22name%22%3A%22oso.top10.projects.datasets.` + this.countryName.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Top%2010%20Projects%22%7D%2C%22subtitle%22%3A%7B%22text%22%3A%22by%20datasets%22%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22datasets%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22projects%22%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Afalse%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%2C%22colors%22%3A%5B%22%23019A85%22%2C%22%232f7ed8%22%2C%22%230d233a%22%2C%22%238bbc21%22%2C%22%23910000%22%2C%22%231aadce%22%2C%22%23492970%22%2C%22%23f28f43%22%2C%22%2377a1e5%22%2C%22%23c42525%22%2C%22%23a6c96a%22%5D%7D%7D`);
-    this.topProjectsBySoftwareGraphURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Software%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22name%22%3A%22oso.top10.projects.software.` + this.countryName.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Top%2010%20Projects%22%7D%2C%22subtitle%22%3A%7B%22text%22%3A%22by%20software%22%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22software%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22projects%22%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Afalse%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%2C%22colors%22%3A%5B%22%2399B2DD%22%2C%22%232f7ed8%22%2C%22%230d233a%22%2C%22%238bbc21%22%2C%22%23910000%22%2C%22%231aadce%22%2C%22%23492970%22%2C%22%23f28f43%22%2C%22%2377a1e5%22%2C%22%23c42525%22%2C%22%23a6c96a%22%5D%7D%7D`);
+    this.publicationsDataSetsSoftwareByYearGraphURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Publications%22%2C%22type%22%3A%22line%22%2C%22query%22%3A%7B%22name%22%3A%22oso.oapublications.` + this.countryPageOverviewData.name.replace(' ', '') + `%22%7D%7D%2C%7B%22name%22%3A%22Datasets%22%2C%22type%22%3A%22line%22%2C%22query%22%3A%7B%22name%22%3A%22oso.oadatasets.` + this.countryPageOverviewData.name.replace(' ', '') + `%22%7D%7D%2C%7B%22name%22%3A%22Software%22%2C%22type%22%3A%22line%22%2C%22query%22%3A%7B%22name%22%3A%22oso.oasoftwares.` + this.countryPageOverviewData.name.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Publications%20vs%20Datasets%20vs%20Software%22%7D%2C%22subtitle%22%3A%7B%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22somethings%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Atrue%2C%22align%22%3A%22center%22%2C%22verticalAlign%22%3A%22bottom%22%2C%22layout%22%3A%22horizontal%22%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%2C%22colors%22%3A%5B%22%2319647E%22%2C%22%23019A85%22%2C%22%2399B2DD%22%2C%22%232f7ed8%22%2C%22%230d233a%22%2C%22%238bbc21%22%2C%22%23910000%22%2C%22%231aadce%22%2C%22%23492970%22%2C%22%23f28f43%22%2C%22%2377a1e5%22%2C%22%23c42525%22%2C%22%23a6c96a%22%5D%7D%7D`);
+    this.publicationsDataSetsSoftwareByFunderGraphURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Publications%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22name%22%3A%22oso.oapublications.funder.` + this.countryPageOverviewData.name.replace(' ', '') + `%22%7D%7D%2C%7B%22name%22%3A%22Datasets%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22name%22%3A%22oso.oadatasets.funder.` + this.countryPageOverviewData.name.replace(' ', '') + `%22%7D%7D%2C%7B%22name%22%3A%22Software%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22name%22%3A%22oso.oasoftwares.funder.` + this.countryPageOverviewData.name.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Publications%20vs%20Datasets%20vs%20Software%22%7D%2C%22subtitle%22%3A%7B%22text%22%3A%22by%20funder%22%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22somethings%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22funder%22%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Atrue%2C%22align%22%3A%22center%22%2C%22verticalAlign%22%3A%22bottom%22%2C%22layout%22%3A%22horizontal%22%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%2C%22colors%22%3A%5B%22%2319647E%22%2C%22%23019A85%22%2C%22%2399B2DD%22%2C%22%232f7ed8%22%2C%22%230d233a%22%2C%22%238bbc21%22%2C%22%23910000%22%2C%22%231aadce%22%2C%22%23492970%22%2C%22%23f28f43%22%2C%22%2377a1e5%22%2C%22%23c42525%22%2C%22%23a6c96a%22%5D%7D%7D`);
+    this.topProjectsByPublicationsGraphURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Publications%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22name%22%3A%22oso.top10.projects.publications.` + this.countryPageOverviewData.name.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Top%2010%20Projects%22%7D%2C%22subtitle%22%3A%7B%22text%22%3A%22by%20publications%22%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22publications%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22projects%22%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Afalse%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%2C%22colors%22%3A%5B%22%2319647E%22%2C%22%232f7ed8%22%2C%22%230d233a%22%2C%22%238bbc21%22%2C%22%23910000%22%2C%22%231aadce%22%2C%22%23492970%22%2C%22%23f28f43%22%2C%22%2377a1e5%22%2C%22%23c42525%22%2C%22%23a6c96a%22%5D%7D%7D`);
+    this.topProjectsByDatasetsGraphURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Datasets%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22name%22%3A%22oso.top10.projects.datasets.` + this.countryPageOverviewData.name.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Top%2010%20Projects%22%7D%2C%22subtitle%22%3A%7B%22text%22%3A%22by%20datasets%22%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22datasets%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22projects%22%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Afalse%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%2C%22colors%22%3A%5B%22%23019A85%22%2C%22%232f7ed8%22%2C%22%230d233a%22%2C%22%238bbc21%22%2C%22%23910000%22%2C%22%231aadce%22%2C%22%23492970%22%2C%22%23f28f43%22%2C%22%2377a1e5%22%2C%22%23c42525%22%2C%22%23a6c96a%22%5D%7D%7D`);
+    this.topProjectsBySoftwareGraphURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22HighCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Software%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22name%22%3A%22oso.top10.projects.software.` + this.countryPageOverviewData.name.replace(' ', '') + `%22%7D%7D%5D%2C%22chart%22%3A%7B%22backgroundColor%22%3A%22%23FFFFFFFF%22%2C%22borderColor%22%3A%22%23335cadff%22%2C%22borderRadius%22%3A0%2C%22borderWidth%22%3A0%2C%22plotBorderColor%22%3A%22%23ccccccff%22%2C%22plotBorderWidth%22%3A0%7D%2C%22title%22%3A%7B%22text%22%3A%22Top%2010%20Projects%22%7D%2C%22subtitle%22%3A%7B%22text%22%3A%22by%20software%22%7D%2C%22yAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22software%22%7D%7D%2C%22xAxis%22%3A%7B%22title%22%3A%7B%22text%22%3A%22projects%22%7D%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22exporting%22%3A%7B%22enabled%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Afalse%7D%7D%7D%2C%22legend%22%3A%7B%22enabled%22%3Afalse%7D%2C%22credits%22%3A%7B%22href%22%3Anull%2C%22enabled%22%3Atrue%2C%22text%22%3A%22Created%20by%20OpenAIRE%20via%20HighCharts%22%7D%2C%22colors%22%3A%5B%22%2399B2DD%22%2C%22%232f7ed8%22%2C%22%230d233a%22%2C%22%238bbc21%22%2C%22%23910000%22%2C%22%231aadce%22%2C%22%23492970%22%2C%22%23f28f43%22%2C%22%2377a1e5%22%2C%22%23c42525%22%2C%22%23a6c96a%22%5D%7D%7D`);
 
-    this.publicationsDataSetsSoftwareByOrganisationTableURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/table?json=%7B%22library%22%3A%22GoogleCharts%22%2C%22tableDescription%22%3A%7B%22queriesInfo%22%3A%5B%7B%22name%22%3A%22Data%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22select%22%3A%5B%7B%22field%22%3A%22result%22%2C%22aggregate%22%3A%22count%22%7D%2C%7B%22field%22%3A%22result.datasource.organization.name%22%2C%22aggregate%22%3Anull%7D%2C%7B%22field%22%3A%22result.type%22%2C%22aggregate%22%3Anull%7D%5D%2C%22filters%22%3A%5B%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22result.datasource.organization.country.name%22%2C%22type%22%3A%22%3D%22%2C%22values%22%3A%5B%22` + this.countryName + `%22%5D%7D%5D%2C%22op%22%3A%22AND%22%7D%2C%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22result.access%20mode%22%2C%22type%22%3A%22%3D%22%2C%22values%22%3A%5B%22Open%20Access%22%5D%7D%2C%7B%22field%22%3A%22result.access%20mode%22%2C%22type%22%3A%22%3D%22%2C%22values%22%3A%5B%22Open%20Source%22%5D%7D%5D%2C%22op%22%3A%22OR%22%7D%2C%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22result.type%22%2C%22type%22%3A%22!%3D%22%2C%22values%22%3A%5B%22other%22%5D%7D%5D%2C%22op%22%3A%22AND%22%7D%5D%2C%22entity%22%3A%22result%22%2C%22profile%22%3A%22OpenAIRE%20original%22%2C%22limit%22%3A%220%22%7D%7D%5D%2C%22columns%22%3A%5B%5D%2C%22options%22%3A%7B%22hAxis%22%3A%7B%7D%2C%22vAxis%22%3A%7B%7D%2C%22chartArea%22%3A%7B%7D%2C%22series%22%3A%5B%5D%2C%22exporting%22%3Afalse%2C%22pageSize%22%3A30%2C%22isStacked%22%3A%22false%22%7D%7D%7D`);
-    this.publicationsDataSetsSoftwareByRepoTableURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/table?json=%7B%22library%22%3A%22GoogleCharts%22%2C%22tableDescription%22%3A%7B%22queriesInfo%22%3A%5B%7B%22name%22%3A%22Data%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22select%22%3A%5B%7B%22field%22%3A%22result%22%2C%22aggregate%22%3A%22count%22%7D%2C%7B%22field%22%3A%22result.datasource.name%22%2C%22aggregate%22%3Anull%7D%2C%7B%22field%22%3A%22result.type%22%2C%22aggregate%22%3Anull%7D%5D%2C%22filters%22%3A%5B%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22result.datasource.organization.country.name%22%2C%22type%22%3A%22%3D%22%2C%22values%22%3A%5B%22` + this.countryName + `%22%5D%7D%5D%2C%22op%22%3A%22AND%22%7D%2C%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22result.access%20mode%22%2C%22type%22%3A%22%3D%22%2C%22values%22%3A%5B%22Open%20Access%22%5D%7D%2C%7B%22field%22%3A%22result.access%20mode%22%2C%22type%22%3A%22%3D%22%2C%22values%22%3A%5B%22Open%20Source%22%5D%7D%5D%2C%22op%22%3A%22OR%22%7D%2C%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22result.type%22%2C%22type%22%3A%22!%3D%22%2C%22values%22%3A%5B%22other%22%5D%7D%5D%2C%22op%22%3A%22AND%22%7D%5D%2C%22entity%22%3A%22result%22%2C%22profile%22%3A%22OpenAIRE%20original%22%2C%22limit%22%3A%220%22%7D%7D%5D%2C%22columns%22%3A%5B%5D%2C%22options%22%3A%7B%22hAxis%22%3A%7B%7D%2C%22vAxis%22%3A%7B%7D%2C%22chartArea%22%3A%7B%7D%2C%22series%22%3A%5B%5D%2C%22exporting%22%3Afalse%2C%22pageSize%22%3A30%2C%22isStacked%22%3A%22false%22%7D%7D%7D`);
+    this.publicationsDataSetsSoftwareByOrganisationTableURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/table?json=%7B%22library%22%3A%22GoogleCharts%22%2C%22tableDescription%22%3A%7B%22queriesInfo%22%3A%5B%7B%22name%22%3A%22Data%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22select%22%3A%5B%7B%22field%22%3A%22result%22%2C%22aggregate%22%3A%22count%22%7D%2C%7B%22field%22%3A%22result.datasource.organization.name%22%2C%22aggregate%22%3Anull%7D%2C%7B%22field%22%3A%22result.type%22%2C%22aggregate%22%3Anull%7D%5D%2C%22filters%22%3A%5B%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22result.datasource.organization.country.name%22%2C%22type%22%3A%22%3D%22%2C%22values%22%3A%5B%22` + this.countryPageOverviewData.name + `%22%5D%7D%5D%2C%22op%22%3A%22AND%22%7D%2C%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22result.access%20mode%22%2C%22type%22%3A%22%3D%22%2C%22values%22%3A%5B%22Open%20Access%22%5D%7D%2C%7B%22field%22%3A%22result.access%20mode%22%2C%22type%22%3A%22%3D%22%2C%22values%22%3A%5B%22Open%20Source%22%5D%7D%5D%2C%22op%22%3A%22OR%22%7D%2C%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22result.type%22%2C%22type%22%3A%22!%3D%22%2C%22values%22%3A%5B%22other%22%5D%7D%5D%2C%22op%22%3A%22AND%22%7D%5D%2C%22entity%22%3A%22result%22%2C%22profile%22%3A%22OpenAIRE%20original%22%2C%22limit%22%3A%220%22%7D%7D%5D%2C%22columns%22%3A%5B%5D%2C%22options%22%3A%7B%22hAxis%22%3A%7B%7D%2C%22vAxis%22%3A%7B%7D%2C%22chartArea%22%3A%7B%7D%2C%22series%22%3A%5B%5D%2C%22exporting%22%3Afalse%2C%22pageSize%22%3A30%2C%22isStacked%22%3A%22false%22%7D%7D%7D`);
+    this.publicationsDataSetsSoftwareByRepoTableURL = this.sanitizer.bypassSecurityTrustResourceUrl(`http://88.197.53.71:8080/stats-api/table?json=%7B%22library%22%3A%22GoogleCharts%22%2C%22tableDescription%22%3A%7B%22queriesInfo%22%3A%5B%7B%22name%22%3A%22Data%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22select%22%3A%5B%7B%22field%22%3A%22result%22%2C%22aggregate%22%3A%22count%22%7D%2C%7B%22field%22%3A%22result.datasource.name%22%2C%22aggregate%22%3Anull%7D%2C%7B%22field%22%3A%22result.type%22%2C%22aggregate%22%3Anull%7D%5D%2C%22filters%22%3A%5B%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22result.datasource.organization.country.name%22%2C%22type%22%3A%22%3D%22%2C%22values%22%3A%5B%22` + this.countryPageOverviewData.name + `%22%5D%7D%5D%2C%22op%22%3A%22AND%22%7D%2C%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22result.access%20mode%22%2C%22type%22%3A%22%3D%22%2C%22values%22%3A%5B%22Open%20Access%22%5D%7D%2C%7B%22field%22%3A%22result.access%20mode%22%2C%22type%22%3A%22%3D%22%2C%22values%22%3A%5B%22Open%20Source%22%5D%7D%5D%2C%22op%22%3A%22OR%22%7D%2C%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22result.type%22%2C%22type%22%3A%22!%3D%22%2C%22values%22%3A%5B%22other%22%5D%7D%5D%2C%22op%22%3A%22AND%22%7D%5D%2C%22entity%22%3A%22result%22%2C%22profile%22%3A%22OpenAIRE%20original%22%2C%22limit%22%3A%220%22%7D%7D%5D%2C%22columns%22%3A%5B%5D%2C%22options%22%3A%7B%22hAxis%22%3A%7B%7D%2C%22vAxis%22%3A%7B%7D%2C%22chartArea%22%3A%7B%7D%2C%22series%22%3A%5B%5D%2C%22exporting%22%3Afalse%2C%22pageSize%22%3A30%2C%22isStacked%22%3A%22false%22%7D%7D%7D`);
   }
 }
Index: modules/open-science-observatory-ui/trunk/src/app/pages/continentoverview/continent-overview.component.html
===================================================================
--- modules/open-science-observatory-ui/trunk/src/app/pages/continentoverview/continent-overview.component.html	(revision 58852)
+++ modules/open-science-observatory-ui/trunk/src/app/pages/continentoverview/continent-overview.component.html	(revision 58853)
@@ -1,66 +1,193 @@
-<section class="greySection uk-padding-small" id="sect-continent-page">
-  <div class="uk-container uk-container-expand uk-margin-medium-top">
+<div class="greySection">
+  <section class="uk-padding-small" id="sect-continent-page">
+    <div class="uk-container uk-container-expand uk-margin-medium-top">
 
-    <ul class="uk-breadcrumb">
-      <li><a [routerLink]="['/home']">Home</a></li>
-      <li><span>{{continentName | titlecase}}</span></li>
-    </ul>
+      <ul class="uk-breadcrumb">
+        <li><a [routerLink]="['/home']">Home</a></li>
+        <li><span>{{continentName | titlecase}}</span></li>
+      </ul>
 
 
-    <div *ngIf="continentName" class="">
-      <img src="../../../assets/img/flags/{{continentName}}-flag.jpg" class="flag-image" width="132" height="132">
+      <div *ngIf="continentName" class="">
+        <img src="../../../assets/img/flags/{{continentName}}-flag.jpg" class="flag-image" width="132" height="132">
+        <div class="uk-inline uk-margin-left">
+          <h1>{{continentName | titlecase}}</h1>
+          <span class="lastUpdateInfo">Info Last Updated: 21 May 2020</span>
+        </div>
+      </div>
+
     </div>
+  </section>
 
-  </div>
-</section>
+  <section class="uk-padding-small">
+    <div class="uk-container uk-container-center uk-margin-medium-top">
 
+      <div *ngIf="!europeOverviewData" class="whiteFilm"><i class="fa fa-spinner fa-spin fa-5x loader" aria-hidden="true"></i></div>
+      <div *ngIf="europeOverviewData" class="uk-grid uk-child-width-1-4 entitiesContainer">
 
+        <!--PUBLICATIONS-->
+        <ng-container *ngIf="europeOverviewData.publications?.percentage">
+          <div class="publicationsColumn uk-padding" [style.height.%]="getHeight(europeOverviewData.publications.percentage)">
+            <div class="entityColumnContent">
+              <span><img src="../../../assets/img/icons/publications-icon-white.svg" [width]="getPublicationsIconWidth(europeOverviewData.publications.percentage)"></span>
+              <span class="number" [style.font-size.px]="getNumberFontSize(europeOverviewData.publications.percentage)"
+                    [ngStyle]="{'margin-top' :europeOverviewData.publications.percentage * 45 /100 + 'px'}">
+              {{europeOverviewData.publications.percentage | number :'1.0-1'}}%
+            </span>
+              <span class="number" [style.font-size.px]="getEntityNameFontSize(europeOverviewData.publications.percentage)"
+                    [ngStyle]="{'margin-top' :europeOverviewData.publications.percentage * 30 /100 + 'px'}">Publications</span>
+            </div>
+          </div>
+        </ng-container>
+        <ng-container *ngIf="!europeOverviewData.publications || !europeOverviewData.publications.percentage">
+          <div class="publicationsColumn uk-padding" style="height: 0%">
 
-<!--TABS SECTION-->
-<section class="section greySection" id="sect-tabs">
-  <div class="uk-container uk-container-expand uk-container-center uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}">
+          </div>
+        </ng-container>
 
-    <div class="">
-      <ul class="uk-tab uk-tab-large uk-flex-center" data-uk-tab="{connect:'#team_tabbed',animation: 'slide-bottom'}">
-        <li class="uk-active" aria-expanded="true"><a href="#">Overview</a></li>
-        <li aria-expanded="false"><a href="#">Open Science</a></li>
-        <li class="uk-disabled" aria-expanded="false"><a href="#" data-uk-tooltip="{title: Stay tuned..; pos: top-left}">Collaboration</a></li>
-        <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Impact</a></li>
-        <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Innovation</a></li>
-        <!--<li class="uk-tab-responsive uk-active uk-hidden" aria-haspopup="true" aria-expanded="false"><a>Developers</a><div class="uk-dropdown uk-dropdown-small" aria-hidden="true"><ul class="uk-nav uk-nav-dropdown"></ul><div></div></div></li>-->
-      </ul>
+        <!--DATASETS-->
+        <ng-container *ngIf="europeOverviewData.datasets?.percentage">
+          <div class="datasetsColumn uk-padding" [style.height.%]="getHeight(europeOverviewData.datasets.percentage)">
+            <div class="entityColumnContent">
+              <span><img src="../../../assets/img/icons/datasets-icon-white.svg" [width]="getDatasetsIconWidth(europeOverviewData.datasets.percentage)"></span>
+              <span class="number" [style.font-size.px]="getNumberFontSize(europeOverviewData.datasets.percentage)"
+                    [ngStyle]="{'margin-top' :europeOverviewData.datasets.percentage * 45 /100 + 'px'}">
+              {{europeOverviewData.datasets.percentage | number :'1.0-1'}}%
+            </span>
+              <span class="number" [style.font-size.px]="getEntityNameFontSize(europeOverviewData.datasets.percentage)"
+                    [ngStyle]="{'margin-top' :europeOverviewData.datasets.percentage * 30 /100 + 'px'}">Datasets</span>
+            </div>
+          </div>
+        </ng-container>
+        <ng-container *ngIf="!europeOverviewData.datasets || !europeOverviewData.datasets.percentage">
+          <div class="datasetsColumn" style="height: 0%">
 
-      <ul *ngIf="overviewData?.countries" id="team_tabbed" class="uk-switcher dataContainer">
-        <!--OVERVIEW tab-->
-        <li aria-hidden="false" class="uk-active" style="animation-duration: 200ms;">
-          <div class="uk-margin tabContent">
-            <app-data-view></app-data-view>
-            <!--<app-countries-table [isPercentage]="false" [type]="'overview'" [countries]="overviewData.countries"></app-countries-table>-->
           </div>
-        </li>
-        <!--OPEN SCIENCE tab-->
-        <li aria-hidden="true" style="animation-duration: 200ms;">
-          <div class="uk-margin tabContent">
-            <app-data-view></app-data-view>
-            <!--<app-countries-table [isPercentage]="false" [type]="'openScience'" [countries]="overviewData.countries"></app-countries-table>-->
+        </ng-container>
+
+        <!--SOFTWARE-->
+        <ng-container *ngIf="europeOverviewData.software?.percentage">
+          <div class="softwareColumn uk-padding" [style.height.%]="getHeight(europeOverviewData.software.percentage)">
+            <div class="entityColumnContent">
+              <span><img src="../../../assets/img/icons/software-icon-white.svg" [width]="getSoftwareIconWidth(europeOverviewData.software.percentage)"></span>
+              <span class="number" [style.font-size.px]="getNumberFontSize(europeOverviewData.software.percentage)"
+                    [ngStyle]="{'margin-top' :europeOverviewData.software.percentage * 45 /100 + 'px'}">
+              {{europeOverviewData.software.percentage | number :'1.0-1'}}%
+            </span>
+              <span class="number" [style.font-size.px]="getEntityNameFontSize(europeOverviewData.software.percentage)"
+                    [ngStyle]="{'margin-top' :europeOverviewData.software.percentage * 30 /100 + 'px'}">Software</span>
+            </div>
           </div>
-        </li>
-        <li aria-hidden="true">
-          <div class="uk-grid uk-grid-medium uk-grid-width-small-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-4" data-uk-grid-margin="">
+        </ng-container>
+        <ng-container *ngIf="!europeOverviewData.software || !europeOverviewData.software.percentage">
+          <div class="softwareColumn" style="height: 0%">
+
           </div>
-        </li>
-        <li aria-hidden="true">
-          <div class="uk-grid uk-grid-medium uk-grid-width-small-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-4" data-uk-grid-margin="">
+        </ng-container>
+
+        <!--OTHER-->
+        <ng-container *ngIf="europeOverviewData.other?.percentage">
+          <div class="otherColumn uk-padding" [style.height.%]="getHeight(europeOverviewData.other.percentage)">
+            <div class="entityColumnContent">
+              <span><img src="../../../assets/img/icons/other-icon-white.svg" [width]="getOtherIconWidth(europeOverviewData.other.percentage)"></span>
+              <span class="number" [style.font-size.px]="getNumberFontSize(europeOverviewData.other.percentage)"
+                    [ngStyle]="{'margin-top' :europeOverviewData.other.percentage * 45 /100 + 'px'}">
+              {{europeOverviewData.other.percentage | number :'1.0-1'}}%
+            </span>
+              <span class="number" [style.font-size.px]="getEntityNameFontSize(europeOverviewData.other.percentage)"
+                    [ngStyle]="{'margin-top' :europeOverviewData.other.percentage * 30 /100 + 'px'}">Other</span>
+            </div>
           </div>
-        </li>
-        <li aria-hidden="true">
-          <div class="uk-grid uk-grid-medium uk-grid-width-small-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-4" data-uk-grid-margin="">
+        </ng-container>
+        <ng-container *ngIf="!europeOverviewData.other || !europeOverviewData.other.percentage">
+          <div class="otherColumn" style="height: 0%">
+
           </div>
-        </li>
-      </ul>
+        </ng-container>
+
+      </div>
+
+      <hr class="entitiesDivider">
+
+      <div class="uk-grid uk-child-width-1-4 uk-margin-large-top">
+
+        <div class="entityLegendContent">
+          <div class="publicationsDot uk-inline"></div>
+          <div class="uk-inline uk-margin-left">
+            <span>Lorem Ipsum Lorem Ipsum Lorem Ipsum</span>
+          </div>
+        </div>
+        <div class="entityLegendContent">
+          <div class="datasetsDot"></div>
+          <div class="uk-inline uk-margin-left">
+            <span>Lorem Ipsum Lorem Ipsum Lorem Ipsum</span>
+          </div>
+        </div>
+        <div class="entityLegendContent">
+          <div class="softwareDot"></div>
+          <div class="uk-inline uk-margin-left">
+            <span>Lorem Ipsum Lorem Ipsum Lorem Ipsum</span>
+          </div>
+        </div>
+        <div class="entityLegendContent">
+          <div class="otherDot"></div>
+          <div class="uk-inline uk-margin-left">
+            <span>Lorem Ipsum Lorem Ipsum Lorem Ipsum</span>
+          </div>
+        </div>
+
+      </div>
     </div>
+  </section>
 
-  </div>
-</section>
+  <!--TABS SECTION-->
+  <section class="section uk-margin-large-top" id="sect-tabs">
+    <div class="uk-container uk-container-expand uk-container-center uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}">
 
+      <div class="">
+        <ul class="uk-tab uk-tab-large uk-flex-center" data-uk-tab="{connect:'#team_tabbed',animation: 'slide-bottom'}">
+          <li class="uk-active" aria-expanded="true"><a href="#">Overview</a></li>
+          <li aria-expanded="false"><a href="#">Open Science</a></li>
+          <li class="uk-disabled" aria-expanded="false"><a href="#" data-uk-tooltip="{title: Stay tuned..; pos: top-left}">Collaboration</a></li>
+          <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Impact</a></li>
+          <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Innovation</a></li>
+          <!--<li class="uk-tab-responsive uk-active uk-hidden" aria-haspopup="true" aria-expanded="false"><a>Developers</a><div class="uk-dropdown uk-dropdown-small" aria-hidden="true"><ul class="uk-nav uk-nav-dropdown"></ul><div></div></div></li>-->
+        </ul>
 
+        <ul *ngIf="overviewData?.countries" id="team_tabbed" class="uk-switcher dataContainer">
+          <!--OVERVIEW tab-->
+          <li aria-hidden="false" class="uk-active" style="animation-duration: 200ms;">
+            <div class="uk-margin tabContent">
+              <app-data-view></app-data-view>
+              <!--<app-countries-table [isPercentage]="false" [type]="'overview'" [countries]="overviewData.countries"></app-countries-table>-->
+            </div>
+          </li>
+          <!--OPEN SCIENCE tab-->
+          <li aria-hidden="true" style="animation-duration: 200ms;">
+            <div class="uk-margin tabContent">
+              <app-data-view></app-data-view>
+              <!--<app-countries-table [isPercentage]="false" [type]="'openScience'" [countries]="overviewData.countries"></app-countries-table>-->
+            </div>
+          </li>
+          <li aria-hidden="true">
+            <div class="uk-grid uk-grid-medium uk-grid-width-small-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-4" data-uk-grid-margin="">
+            </div>
+          </li>
+          <li aria-hidden="true">
+            <div class="uk-grid uk-grid-medium uk-grid-width-small-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-4" data-uk-grid-margin="">
+            </div>
+          </li>
+          <li aria-hidden="true">
+            <div class="uk-grid uk-grid-medium uk-grid-width-small-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-4" data-uk-grid-margin="">
+            </div>
+          </li>
+        </ul>
+      </div>
+
+    </div>
+  </section>
+</div>
+
+
+
+
Index: modules/open-science-observatory-ui/trunk/src/app/pages/continentoverview/continent-overview.component.ts
===================================================================
--- modules/open-science-observatory-ui/trunk/src/app/pages/continentoverview/continent-overview.component.ts	(revision 58852)
+++ modules/open-science-observatory-ui/trunk/src/app/pages/continentoverview/continent-overview.component.ts	(revision 58853)
@@ -1,7 +1,9 @@
 import { Component, OnInit } from '@angular/core';
-import {ActivatedRoute} from '@angular/router';
-import {DomSanitizer} from '@angular/platform-browser';
-import {DataService} from '../../services/data.service';
+import { ActivatedRoute } from '@angular/router';
+import { DomSanitizer } from '@angular/platform-browser';
+import { DataService } from '../../services/data.service';
+import { DataHandlerService } from '../../services/data-handler.service';
+import { EuropeData } from '../../domain/overview-map-data';
 
 @Component({
   selector: 'app-continent-overview',
@@ -12,11 +14,79 @@
 
   continentName: string;
 
+  europeOverviewData: EuropeData;
+
   constructor(private dataService: DataService,
+              private dataHandlerService: DataHandlerService,
               private route: ActivatedRoute,
               private sanitizer: DomSanitizer) { }
 
   ngOnInit(): void {
     this.continentName = this.route.snapshot.paramMap.get('continentName');
+
+    this.dataService.getEuropeOAPercentages().subscribe(
+      rawData => {
+        this.europeOverviewData = this.dataHandlerService.convertRawDataToEuropeOverviewData(rawData);
+      }, error => {
+        console.log(error);
+      }
+    );
   }
+
+  getHeight(percentage: number) {
+    if (percentage < 50) {
+      return Math.round(percentage) * 1.5;
+    } else {
+      return Math.round(percentage);
+    }
+  }
+
+  getNumberFontSize(percentage: number) {
+    if (percentage < 50) {
+      return Math.round(percentage * 45 / 100) * 1.5;
+    } else {
+      return Math.round(percentage * 45 / 100);
+    }
+  }
+
+  getEntityNameFontSize(percentage: number) {
+    if (percentage < 50) {
+      return Math.round(percentage * 30 / 100) * 1.5;
+    } else {
+      return Math.round(percentage * 30 / 100);
+    }
+  }
+
+  getPublicationsIconWidth(percentage: number) {
+    if (percentage < 50) {
+      return Math.round(percentage * 60 / 100) * 1.5;
+    } else {
+      return Math.round(percentage * 60 / 100);
+    }
+  }
+
+  getDatasetsIconWidth(percentage: number) {
+    if (percentage < 50) {
+      return Math.round(percentage * 45 / 100) * 1.5;
+    } else {
+      return Math.round(percentage * 45 / 100);
+    }
+  }
+
+  getSoftwareIconWidth(percentage: number) {
+    if (percentage < 50) {
+      return Math.round(percentage * 50 / 100) * 1.5;
+    } else {
+      return Math.round(percentage * 50 / 100);
+    }
+  }
+
+  getOtherIconWidth(percentage: number) {
+    if (percentage < 50) {
+      return Math.round(percentage * 45 / 100) * 1.5;
+    } else {
+      return Math.round(percentage * 45 / 100);
+    }
+  }
+
 }
Index: modules/open-science-observatory-ui/trunk/src/app/pages/home/countries-table.component.html
===================================================================
--- modules/open-science-observatory-ui/trunk/src/app/pages/home/countries-table.component.html	(revision 58852)
+++ modules/open-science-observatory-ui/trunk/src/app/pages/home/countries-table.component.html	(revision 58853)
@@ -57,13 +57,15 @@
       <td class="uk-text-center">
         <ng-container *ngIf="countryOverview.repositories===null">--</ng-container>
         <ng-container *ngIf="countryOverview.repositories!=null">
-          {{countryOverview.repositories | number}}<ng-container *ngIf="isPercentage">%</ng-container>
+          <ng-container *ngIf="isPercentage">{{countryOverview.repositories | number :'1.0-1'}}%</ng-container>
+          <ng-container *ngIf="!isPercentage">{{countryOverview.repositories | number}}</ng-container>
         </ng-container>
       </td>
       <td class="uk-text-center">
         <ng-container *ngIf="countryOverview.journals===null">--</ng-container>
         <ng-container *ngIf="countryOverview.journals!=null">
-          {{countryOverview.journals | number}}<ng-container *ngIf="isPercentage">%</ng-container>
+          <ng-container *ngIf="isPercentage">{{countryOverview.journals | number :'1.0-1'}}%</ng-container>
+          <ng-container *ngIf="!isPercentage">{{countryOverview.journals | number}}</ng-container>
         </ng-container>
       </td>
       <!--<td class="uk-text-center">-->
@@ -73,7 +75,8 @@
       <td class="uk-text-center">
         <ng-container *ngIf="countryOverview.publications===null">--</ng-container>
         <ng-container *ngIf="countryOverview.publications!=null">
-          {{countryOverview.publications | number}}<ng-container *ngIf="isPercentage">%</ng-container>
+          <ng-container *ngIf="isPercentage">{{countryOverview.publications | number :'1.0-1'}}%</ng-container>
+          <ng-container *ngIf="!isPercentage">{{countryOverview.publications | number}}</ng-container>
           <!--<span style="display: inline-block; float: right; padding-right: 10px;">-->
           <!--<span style="float:left; padding-right: 5px;">{{countryOverview.publications.percentage | number}}% </span>-->
           <!--<ng-container *ngIf="countryOverview.publications?.percentage !=null">-->
@@ -87,19 +90,22 @@
       <td class="uk-text-center">
         <ng-container *ngIf="countryOverview.datasets===null">--</ng-container>
         <ng-container *ngIf="countryOverview.datasets!=null">
-          {{countryOverview.datasets | number}}<ng-container *ngIf="isPercentage">%</ng-container>
+          <ng-container *ngIf="isPercentage">{{countryOverview.datasets | number :'1.0-1'}}%</ng-container>
+          <ng-container *ngIf="!isPercentage">{{countryOverview.datasets | number}}</ng-container>
         </ng-container>
       </td>
       <td class="uk-text-center">
         <ng-container *ngIf="countryOverview.software===null">--</ng-container>
         <ng-container *ngIf="countryOverview.software!=null">
-          {{countryOverview.software | number}}<ng-container *ngIf="isPercentage">%</ng-container>
+          <ng-container *ngIf="isPercentage">{{countryOverview.software | number :'1.0-1'}}%</ng-container>
+          <ng-container *ngIf="!isPercentage">{{countryOverview.software | number}}</ng-container>
         </ng-container>
       </td>
       <td class="uk-text-center">
         <ng-container *ngIf="countryOverview.other===null">--</ng-container>
         <ng-container *ngIf="countryOverview.other!=null">
-          {{countryOverview.other | number}}<ng-container *ngIf="isPercentage">%</ng-container>
+          <ng-container *ngIf="isPercentage">{{countryOverview.other | number :'1.0-1'}}%</ng-container>
+          <ng-container *ngIf="!isPercentage">{{countryOverview.other | number}}</ng-container>
         </ng-container>
       </td>
     </tr>
Index: modules/open-science-observatory-ui/trunk/src/app/pages/home/europe-map-overview.component.ts
===================================================================
--- modules/open-science-observatory-ui/trunk/src/app/pages/home/europe-map-overview.component.ts	(revision 58852)
+++ modules/open-science-observatory-ui/trunk/src/app/pages/home/europe-map-overview.component.ts	(revision 58853)
@@ -42,6 +42,8 @@
 
   joinedPublicationsMap: Map<string, JoinedMapData>;
   joinedDatasetsMap: Map<string, JoinedMapData>;
+  joinedRepositoriesMap: Map<string, JoinedMapData>;
+  joinedJournalsMap: Map<string, JoinedMapData>;
 
   constructor(private dataService: DataService,
               private dataHandlerService: DataHandlerService,
@@ -62,6 +64,8 @@
         this.overviewMapData = this.dataHandlerService.convertRawMapDataToMapData(rawData);
         this.joinedPublicationsMap = this.dataHandlerService.createJoinedPublicationsCountryMap(rawData);
         this.joinedDatasetsMap = this.dataHandlerService.createJoinedDatasetsCountryMap(rawData);
+        this.joinedRepositoriesMap = this.dataHandlerService.createJoinedRepositoriesCountryMap(rawData);
+        this.joinedJournalsMap = this.dataHandlerService.createJoinedJournalsCountryMap(rawData);
 
         // console.log('Country map data', this.overviewMapData[this.activeView]);
         this.loadMap(this.overviewMapData[this.activeView], this.seriesColor, this.seriesColor);
@@ -329,6 +333,10 @@
         '<span class="number">' + params.data.value[2].toLocaleString() + '</span>' +
         '<span><i>repositories</i> from <br>openDOAR & re3data</span></div>';
 
+      tooltip += '<div class="indicator uk-margin-small-top">' +
+        '<span class="number">' + this.joinedRepositoriesMap.get(params.name).simple.toLocaleString() + '</span>' +
+        '<span><i>repositories</i></span></div>';
+
       tooltip += '</div>';
 
     } else if (this.activeView === 'journals') {
@@ -336,8 +344,12 @@
       tooltip += '<div class="numbers">';
       tooltip += '<div class="indicator">' +
         '<span class="number">' + params.data.value[2].toLocaleString() + '</span>' +
-        '<span><i>journals</i> from <br>DOAJ</span></div>';
+        '<span><i>journals</i> from DOAJ</span></div>';
 
+      tooltip += '<div class="indicator uk-margin-small-top">' +
+        '<span class="number">' + this.joinedJournalsMap.get(params.name).simple.toLocaleString() + '</span>' +
+        '<span><i>journals</i></span></div>';
+
       tooltip += '</div>';
 
     } else {
Index: modules/open-science-observatory-ui/trunk/src/app/pages/home/data-view.component.html
===================================================================
--- modules/open-science-observatory-ui/trunk/src/app/pages/home/data-view.component.html	(revision 58852)
+++ modules/open-science-observatory-ui/trunk/src/app/pages/home/data-view.component.html	(revision 58853)
@@ -35,7 +35,7 @@
         </select>
         <!--<span class="md-input-bar"></span>-->
       </div>
-      <div *ngIf="loading" class="whiteFilm"><i class="fa fa-spinner fa-spin fa-2x loader" aria-hidden="true"></i></div>
+      <div *ngIf="loadingAbsoluteTable" class="whiteFilm"><i class="fa fa-spinner fa-spin fa-2x loader" aria-hidden="true"></i></div>
       <app-countries-table *ngIf="tableAbsoluteData" [isPercentage]="false" [countries]="tableAbsoluteData"></app-countries-table>
     </div>
   </li>
@@ -52,6 +52,7 @@
         </select>
         <!--<span class="md-input-bar"></span>-->
       </div>
+      <div *ngIf="loadingPercentageTable" class="whiteFilm"><i class="fa fa-spinner fa-spin fa-2x loader" aria-hidden="true"></i></div>
       <app-countries-table *ngIf="tablePercentageData" [isPercentage]="true" [countries]="tablePercentageData"></app-countries-table>
     </div>
   </li>
Index: modules/open-science-observatory-ui/trunk/src/app/pages/home/data-view.component.ts
===================================================================
--- modules/open-science-observatory-ui/trunk/src/app/pages/home/data-view.component.ts	(revision 58852)
+++ modules/open-science-observatory-ui/trunk/src/app/pages/home/data-view.component.ts	(revision 58853)
@@ -22,7 +22,8 @@
   tableAbsoluteData: CountryTableData[];
   tablePercentageData: CountryTableData[];
 
-  loading: boolean = true;
+  loadingAbsoluteTable: boolean = true;
+  loadingPercentageTable: boolean = true;
 
   oaPublicationsURL: SafeResourceUrl;
   oaRepositoriesURL: SafeResourceUrl;
@@ -37,30 +38,31 @@
 
   ngOnInit(): void {
     this.getAbsoluteData();
+    this.getPercentageData();
   }
 
   getAbsoluteData() {
-    this.loading = true;
+    this.loadingAbsoluteTable = true;
     this.dataService.getOverviewTableAbsoluteData(this.contentAbsoluteSelection).subscribe(
       rawData => {
         this.tableAbsoluteData = this.dataHandlerService.convertRawDataToAbsoluteTableData(rawData);
-        this.loading = false;
+        this.loadingAbsoluteTable = false;
       }, error => {
         console.log(error);
-        this.loading = false;
+        this.loadingAbsoluteTable = false;
       }
     );
   }
 
   getPercentageData() {
-    this.loading = true;
-    this.dataService.getOverviewTableAbsoluteData(this.contentPercentageSelection).subscribe(
+    this.loadingPercentageTable = true;
+    this.dataService.getOverviewTablePercentageData(this.contentPercentageSelection).subscribe(
       rawData => {
-        this.tablePercentageData = this.dataHandlerService.convertRawDataToAbsoluteTableData(rawData);
-        this.loading = false;
+        this.tablePercentageData = this.dataHandlerService.convertRawDataToPercentageTableData(rawData);
+        this.loadingPercentageTable = false;
       }, error => {
         console.log(error);
-        this.loading = false;
+        this.loadingPercentageTable = false;
       }
     );
   }
Index: modules/open-science-observatory-ui/trunk/src/app/services/data-handler.service.ts
===================================================================
--- modules/open-science-observatory-ui/trunk/src/app/services/data-handler.service.ts	(revision 58852)
+++ modules/open-science-observatory-ui/trunk/src/app/services/data-handler.service.ts	(revision 58853)
@@ -1,6 +1,13 @@
 import { Injectable } from '@angular/core';
 import { RawData, Row } from '../domain/raw-data';
-import {CountryOverviewData, CountryMapData, EuropeData, OverviewMapData, CountryTableData} from '../domain/overview-map-data';
+import {
+  CountryOverviewData,
+  CountryMapData,
+  EuropeData,
+  OverviewMapData,
+  CountryTableData,
+  CountryPageOverviewData
+} from '../domain/overview-map-data';
 import {Indicator} from '../domain/overview-data';
 
 @Injectable ()
@@ -16,9 +23,9 @@
         overviewMapData.publications = this.rawResultToCountryMapData(series.series.result);
       } else if (series.series.query.name === 'new.oso.datasets.affiliated') {
         overviewMapData.datasets = this.rawResultToCountryMapData(series.series.result);
-      } else if (series.series.query.name === 'new.oso.repositories') {
+      } else if (series.series.query.name === 'new.oso.repositories.doar_re3data') {
         overviewMapData.repositories = this.rawResultToCountryMapData(series.series.result);
-      } else if (series.series.query.name === 'new.oso.journals') {
+      } else if (series.series.query.name === 'new.oso.journals.doaj') {
         overviewMapData.journals = this.rawResultToCountryMapData(series.series.result);
       } else if (series.series.query.name === 'new.oso.oa_policies') {
         overviewMapData.policies = this.rawResultToCountryMapData(series.series.result);
@@ -105,6 +112,82 @@
 
   }
 
+  public createJoinedRepositoriesCountryMap(rawData: RawData) {
+
+    const joinedRepositoriesMap = new Map();
+
+    for (const series of rawData.datasets) {
+      if (series.series.query.name === 'new.oso.repositories.doar_re3data') {
+
+        for (const rowResult of series.series.result) {
+          if (joinedRepositoriesMap.has(rowResult.row[1])) {
+            const simple = joinedRepositoriesMap.get(rowResult.row[1]).simple;
+            joinedRepositoriesMap.delete(rowResult.row[1]);
+            joinedRepositoriesMap.set(rowResult.row[1], {countryName: rowResult.row[1], countryCode: rowResult.row[2],
+              doar_re3data: Number(rowResult.row[0]), simple: simple});
+          } else {
+            joinedRepositoriesMap.set(rowResult.row[1], {countryName: rowResult.row[1], countryCode: rowResult.row[2],
+              doar_re3data: Number(rowResult.row[0]), simple: 0});
+          }
+        }
+
+      } else if (series.series.query.name === 'new.oso.repositories') {
+
+        for (const rowResult of series.series.result) {
+          if (joinedRepositoriesMap.has(rowResult.row[1])) {
+            const doar_re3data = joinedRepositoriesMap.get(rowResult.row[1]).doar_re3data;
+            joinedRepositoriesMap.delete(rowResult.row[1]);
+            joinedRepositoriesMap.set(rowResult.row[1], {countryName: rowResult.row[1], countryCode: rowResult.row[2],
+              doar_re3data: doar_re3data, simple: Number(rowResult.row[0])});
+          }
+          joinedRepositoriesMap.set(rowResult.row[1], { countryName: rowResult.row[1], countryCode: rowResult.row[2],
+            doar_re3data: 0, simple: Number(rowResult.row[0])});
+        }
+      }
+    }
+
+    return joinedRepositoriesMap;
+
+  }
+
+  public createJoinedJournalsCountryMap(rawData: RawData) {
+
+    const joinedJournalsMap = new Map();
+
+    for (const series of rawData.datasets) {
+      if (series.series.query.name === 'new.oso.journals.doaj') {
+
+        for (const rowResult of series.series.result) {
+          if (joinedJournalsMap.has(rowResult.row[1])) {
+            const simple = joinedJournalsMap.get(rowResult.row[1]).simple;
+            joinedJournalsMap.delete(rowResult.row[1]);
+            joinedJournalsMap.set(rowResult.row[1], {countryName: rowResult.row[1], countryCode: rowResult.row[2],
+              doaj: Number(rowResult.row[0]), simple: simple});
+          } else {
+            joinedJournalsMap.set(rowResult.row[1], {countryName: rowResult.row[1], countryCode: rowResult.row[2],
+              doaj: Number(rowResult.row[0]), simple: 0});
+          }
+        }
+
+      } else if (series.series.query.name === 'new.oso.journals') {
+
+        for (const rowResult of series.series.result) {
+          if (joinedJournalsMap.has(rowResult.row[1])) {
+            const doaj = joinedJournalsMap.get(rowResult.row[1]).doaj;
+            joinedJournalsMap.delete(rowResult.row[1]);
+            joinedJournalsMap.set(rowResult.row[1], {countryName: rowResult.row[1], countryCode: rowResult.row[2],
+              doaj: doaj, simple: Number(rowResult.row[0])});
+          }
+          joinedJournalsMap.set(rowResult.row[1], { countryName: rowResult.row[1], countryCode: rowResult.row[2],
+            doaj: 0, simple: Number(rowResult.row[0])});
+        }
+      }
+    }
+
+    return joinedJournalsMap;
+
+  }
+
   public convertRawDataToCountryOverviewData(rawData: RawData) {
 
     const countryData: CountryOverviewData = new CountryOverviewData();
@@ -153,6 +236,22 @@
         datasetsIndicator.total = Number(series.series.result[0].row[2]);
         europeData.datasets = datasetsIndicator;
 
+      } else if (series.series.query.name === 'new.oso.software.oa_percentage') {
+
+        const softwareIndicator: Indicator = new Indicator();
+        softwareIndicator.percentage = Number(series.series.result[0].row[0]);
+        softwareIndicator.oa = Number(series.series.result[0].row[1]);
+        softwareIndicator.total = Number(series.series.result[0].row[2]);
+        europeData.software = softwareIndicator;
+
+      } else if (series.series.query.name === 'new.oso.other.oa_percentage') {
+
+        const otherIndicator: Indicator = new Indicator();
+        otherIndicator.percentage = Number(series.series.result[0].row[0]);
+        otherIndicator.oa = Number(series.series.result[0].row[1]);
+        otherIndicator.total = Number(series.series.result[0].row[2]);
+        europeData.other = otherIndicator;
+
       } else if (series.series.query.name === 'new.oso.repositories.doar_re3data.validated') {
 
         const repositoriesIndicator: Indicator = new Indicator();
@@ -322,6 +421,262 @@
     return tableData;
   }
 
+  public convertRawDataToPercentageTableData(rawData: RawData) {
+
+    const mapTableData: Map<string, CountryTableData> = new Map();
+
+    for (const series of rawData.datasets) {
+
+      if (series.series.query.name.includes('new.oso.results')
+        && series.series.query.parameters && series.series.query.parameters[0] === 'publication') {
+        for (const rowResult of series.series.result) {
+
+          // remove unwanted countries
+          if (this.isCountryToBeRemoved(rowResult.row[4])) {
+            continue;
+          }
+
+          if (mapTableData.has(rowResult.row[4])) {
+            const countryTableData = mapTableData.get(rowResult.row[4]);
+            if (rowResult.row[0] !== 'NaN') {
+              countryTableData.publications = Number(rowResult.row[0]);
+            }
+          } else {
+            const countryTableData: CountryTableData = new CountryTableData();
+            if (rowResult.row[0] !== 'NaN') {
+              countryTableData.publications = Number(rowResult.row[0]);
+            }
+            countryTableData.name = rowResult.row[3];
+            countryTableData.code = rowResult.row[4];
+            mapTableData.set(rowResult.row[4], countryTableData);
+          }
+        }
+
+      } else if (series.series.query.name.includes('new.oso.results')
+        && series.series.query.parameters && series.series.query.parameters[0] === 'dataset') {
+
+        for (const rowResult of series.series.result) {
+
+          // remove unwanted countries
+          if (this.isCountryToBeRemoved(rowResult.row[4])) {
+            continue;
+          }
+
+          if (mapTableData.has(rowResult.row[4])) {
+            const countryTableData = mapTableData.get(rowResult.row[4]);
+            if (rowResult.row[0] !== 'NaN') {
+              countryTableData.datasets = Number(rowResult.row[0]);
+            }
+          } else {
+            const countryTableData: CountryTableData = new CountryTableData();
+            if (rowResult.row[0] !== 'NaN') {
+              countryTableData.datasets = Number(rowResult.row[0]);
+            }
+            countryTableData.name = rowResult.row[3];
+            countryTableData.code = rowResult.row[4];
+            mapTableData.set(rowResult.row[4], countryTableData);
+          }
+        }
+      } else if (series.series.query.name.includes('new.oso.results')
+        && series.series.query.parameters && series.series.query.parameters[0] === 'software') {
+
+        for (const rowResult of series.series.result) {
+
+          // remove unwanted countries
+          if (this.isCountryToBeRemoved(rowResult.row[4])) {
+            continue;
+          }
+
+          if (mapTableData.has(rowResult.row[4])) {
+            const countryTableData = mapTableData.get(rowResult.row[4]);
+            if (rowResult.row[0] !== 'NaN') {
+              countryTableData.software = Number(rowResult.row[0]);
+            }
+          } else {
+            const countryTableData: CountryTableData = new CountryTableData();
+            if (rowResult.row[0] !== 'NaN') {
+              countryTableData.software = Number(rowResult.row[0]);
+            }
+            countryTableData.name = rowResult.row[3];
+            countryTableData.code = rowResult.row[4];
+            mapTableData.set(rowResult.row[4], countryTableData);
+          }
+        }
+      } else if (series.series.query.name.includes('new.oso.results')
+        && series.series.query.parameters && series.series.query.parameters[0] === 'other') {
+
+        for (const rowResult of series.series.result) {
+
+          // remove unwanted countries
+          if (this.isCountryToBeRemoved(rowResult.row[4])) {
+            continue;
+          }
+
+          if (mapTableData.has(rowResult.row[4])) {
+            const countryTableData = mapTableData.get(rowResult.row[4]);
+            if (rowResult.row[0] !== 'NaN') {
+              countryTableData.other = Number(rowResult.row[0]);
+            }
+          } else {
+            const countryTableData: CountryTableData = new CountryTableData();
+            if (rowResult.row[0] !== 'NaN') {
+              countryTableData.other = Number(rowResult.row[0]);
+            }
+            countryTableData.name = rowResult.row[3];
+            countryTableData.code = rowResult.row[4];
+            mapTableData.set(rowResult.row[4], countryTableData);
+          }
+        }
+      } else if (series.series.query.name.includes('new.oso.repositories')) {
+
+        for (const rowResult of series.series.result) {
+
+          // remove unwanted countries
+          if (this.isCountryToBeRemoved(rowResult.row[4])) {
+            continue;
+          }
+
+          if (mapTableData.has(rowResult.row[4])) {
+            const countryTableData = mapTableData.get(rowResult.row[4]);
+            countryTableData.repositories = Number(rowResult.row[0]);
+          } else {
+            const countryTableData: CountryTableData = new CountryTableData();
+            countryTableData.repositories = Number(rowResult.row[0]);
+            countryTableData.name = rowResult.row[3];
+            countryTableData.code = rowResult.row[4];
+            mapTableData.set(rowResult.row[4], countryTableData);
+          }
+        }
+      } else if (series.series.query.name.includes('new.oso.journals')) {
+
+        for (const rowResult of series.series.result) {
+
+          // remove unwanted countries
+          if (this.isCountryToBeRemoved(rowResult.row[4])) {
+            continue;
+          }
+
+          if (mapTableData.has(rowResult.row[4])) {
+            const countryTableData = mapTableData.get(rowResult.row[4]);
+            countryTableData.journals = Number(rowResult.row[0]);
+          } else {
+            const countryTableData: CountryTableData = new CountryTableData();
+            countryTableData.journals = Number(rowResult.row[0]);
+            countryTableData.name = rowResult.row[3];
+            countryTableData.code = rowResult.row[4];
+            mapTableData.set(rowResult.row[4], countryTableData);
+          }
+        }
+      }
+    }
+
+    const tableData: CountryTableData[] = [];
+
+    mapTableData.forEach((value: CountryTableData, key: string) => {
+      // console.log(key, value);
+      tableData.push(value);
+    });
+
+    return tableData;
+  }
+
+  public convertRawDataToCountryPageOverviewData(rawData: RawData) {
+
+    const countryPageOverviewData: CountryPageOverviewData = new CountryPageOverviewData();
+
+    for (const series of rawData.datasets) {
+
+      if ((series.series.query.name === 'new.oso.results.oa_percentage.country')
+        && series.series.query.parameters && series.series.query.parameters[0] === 'publication') {
+
+        countryPageOverviewData.name = series.series.result[0].row[3];
+        countryPageOverviewData.code = series.series.result[0].row[4];
+
+        const publicationsAffiliatedIndicator: Indicator = new Indicator();
+        publicationsAffiliatedIndicator.percentage = Number(series.series.result[0].row[0]);
+        publicationsAffiliatedIndicator.oa = Number(series.series.result[0].row[1]);
+        publicationsAffiliatedIndicator.total = Number(series.series.result[0].row[2]);
+        countryPageOverviewData.publicationsAffiliated = publicationsAffiliatedIndicator;
+
+      } else if ((series.series.query.name === 'new.oso.results.oa_percentage.deposited.country')
+        && series.series.query.parameters && series.series.query.parameters[0] === 'publication') {
+
+        countryPageOverviewData.name = series.series.result[0].row[3];
+        countryPageOverviewData.code = series.series.result[0].row[4];
+
+        const publicationsDepositedIndicator: Indicator = new Indicator();
+        publicationsDepositedIndicator.percentage = Number(series.series.result[0].row[0]);
+        publicationsDepositedIndicator.oa = Number(series.series.result[0].row[1]);
+        publicationsDepositedIndicator.total = Number(series.series.result[0].row[2]);
+        countryPageOverviewData.publicationsDeposited = publicationsDepositedIndicator;
+
+      } if ((series.series.query.name === 'new.oso.results.oa_percentage.country')
+        && series.series.query.parameters && series.series.query.parameters[0] === 'dataset') {
+
+        countryPageOverviewData.name = series.series.result[0].row[3];
+        countryPageOverviewData.code = series.series.result[0].row[4];
+
+        const datasetsAffiliatedIndicator: Indicator = new Indicator();
+        datasetsAffiliatedIndicator.percentage = Number(series.series.result[0].row[0]);
+        datasetsAffiliatedIndicator.oa = Number(series.series.result[0].row[1]);
+        datasetsAffiliatedIndicator.total = Number(series.series.result[0].row[2]);
+        countryPageOverviewData.datasetsAffiliated = datasetsAffiliatedIndicator;
+
+      } else if ((series.series.query.name === 'new.oso.results.oa_percentage.deposited.country')
+        && series.series.query.parameters && series.series.query.parameters[0] === 'dataset') {
+
+        countryPageOverviewData.name = series.series.result[0].row[3];
+        countryPageOverviewData.code = series.series.result[0].row[4];
+
+        const datasetsDepositedIndicator: Indicator = new Indicator();
+        datasetsDepositedIndicator.percentage = Number(series.series.result[0].row[0]);
+        datasetsDepositedIndicator.oa = Number(series.series.result[0].row[1]);
+        datasetsDepositedIndicator.total = Number(series.series.result[0].row[2]);
+        countryPageOverviewData.datasetsDeposited = datasetsDepositedIndicator;
+
+      } else if (series.series.query.name === 'new.oso.repositories.doar_re3data.validated.country') {
+
+        countryPageOverviewData.name = series.series.result[0].row[3];
+        countryPageOverviewData.code = series.series.result[0].row[4];
+
+        const repositoriesIndicator: Indicator = new Indicator();
+        repositoriesIndicator.percentage = Number(series.series.result[0].row[0]);
+        repositoriesIndicator.oa = Number(series.series.result[0].row[1]);
+        repositoriesIndicator.total = Number(series.series.result[0].row[2]);
+        countryPageOverviewData.repositories = repositoriesIndicator;
+
+      } else if (series.series.query.name === 'new.oso.journals.doaj.validated.country') {
+
+        countryPageOverviewData.name = series.series.result[0].row[3];
+        countryPageOverviewData.code = series.series.result[0].row[4];
+
+        const journalsIndicator: Indicator = new Indicator();
+        journalsIndicator.percentage = Number(series.series.result[0].row[0]);
+        journalsIndicator.oa = Number(series.series.result[0].row[1]);
+        journalsIndicator.total = Number(series.series.result[0].row[2]);
+        countryPageOverviewData.journals = journalsIndicator;
+
+      } else if (series.series.query.name === 'new.oso.oa_policies.country') {
+
+        countryPageOverviewData.policies = Number(series.series.result[0].row[0]);
+
+      } else if (series.series.query.name === 'new.oso.funder.country') {
+
+        countryPageOverviewData.funders = Number(series.series.result[0].row[0]);
+
+      } else if (series.series.query.name === 'new.oso.funding_organizations.country') {
+
+        countryPageOverviewData.fundingOrganizations = Number(series.series.result[0].row[0]);
+
+      } else if (series.series.query.name === 'new.oso.ec_funded_organizations.country') {
+
+        countryPageOverviewData.ec_fundedOrganizations = Number(series.series.result[0].row[0]);
+      }
+    }
+
+    return countryPageOverviewData;
+  }
+
   private rawResultToCountryMapData(result: Row[]) {
 
     const entityMapData: CountryMapData[] = [];
Index: modules/open-science-observatory-ui/trunk/src/app/services/data.service.ts
===================================================================
--- modules/open-science-observatory-ui/trunk/src/app/services/data.service.ts	(revision 58852)
+++ modules/open-science-observatory-ui/trunk/src/app/services/data.service.ts	(revision 58853)
@@ -21,7 +21,7 @@
   }
 
   public getOverviewMapData(): Observable<RawData> {
-    const mapDataQuery = '%7B%22series%22%3A%5B%7B%22query%22%3A%7B%22name%22%3A%22new.oso.publications.affiliated%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.publications.deposited%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.datasets.affiliated%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.datasets.deposited%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.repositories%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.journals%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.oa_policies%22%7D%7D%5D%2C%22verbose%22%3Atrue%7D';
+    const mapDataQuery = '%7B%22series%22%3A%5B%7B%22query%22%3A%7B%22name%22%3A%22new.oso.publications.affiliated%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.publications.deposited%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.datasets.affiliated%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.datasets.deposited%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.repositories%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.repositories.doar_re3data%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.journals%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.journals.doaj%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.oa_policies%22%7D%7D%5D%2C%22verbose%22%3Atrue%7D';
     return this.httpClient.get<RawData>(this.apiURL + mapDataQuery, headerOptions);
   }
 
@@ -52,17 +52,31 @@
   public getOverviewTablePercentageData(content: string): Observable<RawData> {
     let overviewTablePercentageDataQuery = '';
     if (content === 'affiliated') {
-      overviewTablePercentageDataQuery = '';
+      overviewTablePercentageDataQuery = '%7B%22series%22%3A%5B%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.bycountry%22%2C%22parameters%22%3A%5B%22publication%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.bycountry%22%2C%22parameters%22%3A%5B%22dataset%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.bycountry%22%2C%22parameters%22%3A%5B%22software%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.bycountry%22%2C%22parameters%22%3A%5B%22other%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.repositories.doar_re3data.validated.bycountry%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.journals.doaj.validated.bycountry%22%7D%7D%5D%2C%22verbose%22%3Atrue%7D';
     } else if (content === 'affiliated_peer_reviewed') {
-      overviewTablePercentageDataQuery = '';
+      overviewTablePercentageDataQuery = '%7B%22series%22%3A%5B%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.affiliated.peer_reviewed.bycountry%22%2C%22parameters%22%3A%5B%22publication%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.affiliated.peer_reviewed.bycountry%22%2C%22parameters%22%3A%5B%22dataset%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.affiliated.peer_reviewed.bycountry%22%2C%22parameters%22%3A%5B%22software%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.affiliated.peer_reviewed.bycountry%22%2C%22parameters%22%3A%5B%22other%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.repositories.doar_re3data.validated.bycountry%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.journals.doaj.validated.bycountry%22%7D%7D%5D%2C%22verbose%22%3Atrue%7D';
     } else if (content === 'deposited') {
-      overviewTablePercentageDataQuery = '';
+      overviewTablePercentageDataQuery = '%7B%22series%22%3A%5B%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.deposited.bycountry%22%2C%22parameters%22%3A%5B%22publication%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.deposited.bycountry%22%2C%22parameters%22%3A%5B%22dataset%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.deposited.bycountry%22%2C%22parameters%22%3A%5B%22software%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.deposited.bycountry%22%2C%22parameters%22%3A%5B%22other%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.repositories.doar_re3data.validated.bycountry%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.journals.doaj.validated.bycountry%22%7D%7D%5D%2C%22verbose%22%3Atrue%7D';
     } else if (content === 'deposited_peer_reviewed') {
-      overviewTablePercentageDataQuery = '';
+      overviewTablePercentageDataQuery = '%7B%22series%22%3A%5B%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.deposited.peer_reviewed.bycountry%22%2C%22parameters%22%3A%5B%22publication%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.deposited.peer_reviewed.bycountry%22%2C%22parameters%22%3A%5B%22dataset%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.deposited.peer_reviewed.bycountry%22%2C%22parameters%22%3A%5B%22software%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.deposited.peer_reviewed.bycountry%22%2C%22parameters%22%3A%5B%22other%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.repositories.doar_re3data.validated.bycountry%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.journals.doaj.validated.bycountry%22%7D%7D%5D%2C%22verbose%22%3Atrue%7D';
     }
     return this.httpClient.get<RawData>(this.apiURL + overviewTablePercentageDataQuery, headerOptions);
   }
 
+  public getEuropeOAPercentages(): Observable<RawData> {
+    const europeOAPercentagesQuery = '%7B%22series%22%3A%5B%7B%22query%22%3A%7B%22name%22%3A%22new.oso.publications.oa_percentage%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.datasets.oa_percentage%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.software.oa_percentage%22%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.other.oa_percentage%22%7D%7D%5D%2C%22verbose%22%3Atrue%7D';
+    return this.httpClient.get<RawData>(this.apiURL + europeOAPercentagesQuery, headerOptions);
+  }
+
+  public getCountryPageOverviewData(countryCode: string): Observable<RawData> {
+    const countryPageOverviewDataQuery = '%7B%22series%22%3A%5B%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.country%22%2C%20%22parameters%22%3A%5B%22publication%22%2C%22DE%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.deposited.country%22%2C%20%22parameters%22%3A%5B%22publication%22%2C%22DE%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.country%22%2C%20%22parameters%22%3A%5B%22dataset%22%2C%22DE%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.results.oa_percentage.deposited.country%22%2C%20%22parameters%22%3A%5B%22dataset%22%2C%22DE%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.repositories.doar_re3data.validated.country%22%2C%20%22parameters%22%3A%5B%22DE%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.journals.doaj.validated.country%22%2C%20%22parameters%22%3A%5B%22DE%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.oa_policies.country%22%2C%20%22parameters%22%3A%5B%22DE%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.funder.country%22%2C%20%22parameters%22%3A%5B%22DE%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.funding_organizations.country%22%2C%20%22parameters%22%3A%5B%22DE%22%5D%7D%7D%2C%7B%22query%22%3A%7B%22name%22%3A%22new.oso.ec_funded_organizations.country%22%2C%20%22parameters%22%3A%5B%22DE%22%5D%7D%7D%5D%2C%22verbose%22%3Atrue%7D';
+    return this.httpClient.get<RawData>(this.apiURL + countryPageOverviewDataQuery, headerOptions);
+  }
+
+
+
+
+
   public getOverviewData(): Observable<OverviewData> {
     return this.httpClient.get<OverviewData>(this._jsonURl, headerOptions);
   }
Index: modules/open-science-observatory-ui/trunk/src/app/domain/raw-data.ts
===================================================================
--- modules/open-science-observatory-ui/trunk/src/app/domain/raw-data.ts	(revision 58852)
+++ modules/open-science-observatory-ui/trunk/src/app/domain/raw-data.ts	(revision 58853)
@@ -13,7 +13,7 @@
 
 export class Query {
   name: string;
-  parameters: string;
+  parameters: string[];
   filters: string;
   select: string;
   entity: string;
Index: modules/open-science-observatory-ui/trunk/src/app/domain/overview-map-data.ts
===================================================================
--- modules/open-science-observatory-ui/trunk/src/app/domain/overview-map-data.ts	(revision 58852)
+++ modules/open-science-observatory-ui/trunk/src/app/domain/overview-map-data.ts	(revision 58853)
@@ -19,6 +19,9 @@
   countryCode: string;
   affiliated: number;
   deposited: number;
+  doar_re3data: number;
+  doaj: number;
+  simple: number;
 }
 
 export class SelectedCountry {
@@ -41,6 +44,8 @@
 export class EuropeData {
   publications: Indicator;
   datasets: Indicator;
+  software: Indicator;
+  other: Indicator;
   repositories: Indicator;
   journals: Indicator;
   policies: Indicator;
@@ -57,3 +62,18 @@
   journals: number = null;
   policies: number = null;
 }
+
+export class CountryPageOverviewData {
+  name: string = null;
+  code: string = null;
+  publicationsAffiliated: Indicator;
+  publicationsDeposited: Indicator ;
+  datasetsAffiliated: Indicator;
+  datasetsDeposited: Indicator;
+  repositories: Indicator;
+  journals: Indicator;
+  policies: number = null;
+  funders: number = null;
+  fundingOrganizations: number = null;
+  ec_fundedOrganizations: number = null;
+}
Index: modules/open-science-observatory-ui/trunk/src/app/app-routing.module.ts
===================================================================
--- modules/open-science-observatory-ui/trunk/src/app/app-routing.module.ts	(revision 58852)
+++ modules/open-science-observatory-ui/trunk/src/app/app-routing.module.ts	(revision 58853)
@@ -25,7 +25,7 @@
     component: ContinentOverviewComponent
   },
   {
-    path: 'countryDashboard/:countryName',
+    path: 'countryDashboard/:countryCode',
     component: CountryPageComponent
   },
   {
Index: modules/open-science-observatory-ui/trunk/src/assets/css/os-observatory-custom.css
===================================================================
--- modules/open-science-observatory-ui/trunk/src/assets/css/os-observatory-custom.css	(revision 58852)
+++ modules/open-science-observatory-ui/trunk/src/assets/css/os-observatory-custom.css	(revision 58853)
@@ -736,3 +736,102 @@
   align-items: center;
 }
 /**************************/
+
+.lastUpdateInfo {
+  opacity: 0.4;
+  color: #000;
+  letter-spacing: 0px;
+}
+
+.entitiesContainer {
+  height: 300px;
+  display: flex;
+  align-items: flex-end;
+}
+
+.publicationsColumn {
+  background-color: #f181ae;
+  box-shadow: 3px 3px 6px #00000029;
+  opacity: 1;
+  z-index: 10;
+}
+
+.publicationsDot {
+  background-color: #f181ae;
+  width: 50px;
+  height: 33px;
+  border-radius: 50%;
+}
+
+.datasetsColumn {
+  background-color: #ae91d6;
+  box-shadow: 3px 3px 6px #00000029;
+  opacity: 1;
+  z-index: 8;
+}
+
+.datasetsDot {
+  background-color: #ae91d6;
+  width: 50px;
+  height: 33px;
+  border-radius: 50%;
+}
+
+.softwareColumn {
+  background-color: #8f1043;
+  box-shadow: 3px 3px 6px #00000029;
+  opacity: 1;
+  z-index: 6;
+}
+
+.softwareDot {
+  background-color: #8f1043;
+  width: 50px;
+  height: 33px;
+  border-radius: 50%;
+}
+
+.otherColumn {
+  background-color: #00a1c2;
+  box-shadow: 3px 3px 6px #00000029;
+  opacity: 1;
+  z-index: 4;
+}
+
+.otherDot {
+  background-color: #00a1c2;
+  width: 50px;
+  height: 33px;
+  border-radius: 50%;
+}
+
+.entityColumnContent {
+  color: #fff;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  text-align: center;
+}
+
+hr.entitiesDivider {
+  border: 2px solid #B4B4B4;
+  margin-left: -90px;
+  margin-right: -50px;
+  margin-top: 0px;
+}
+
+.entityLegendContent {
+  display: flex;
+  padding-right: 40px;
+
+}
+
+
+
+
+.countryPageHeader {
+  display: flex;
+  justify-content: space-between;
+}
Index: modules/open-science-observatory-ui/trunk/src/assets/img/icons/other-icon-white.svg
===================================================================
Cannot display: file marked as a binary type.
svn:mime-type = image/svg+xml
Index: modules/open-science-observatory-ui/trunk/src/assets/img/icons/other-icon-white.svg
===================================================================
--- modules/open-science-observatory-ui/trunk/src/assets/img/icons/other-icon-white.svg	(nonexistent)
+++ modules/open-science-observatory-ui/trunk/src/assets/img/icons/other-icon-white.svg	(revision 58853)

Property changes on: modules/open-science-observatory-ui/trunk/src/assets/img/icons/other-icon-white.svg
___________________________________________________________________
Added: svn:mime-type
## -0,0 +1 ##
+image/svg+xml
\ No newline at end of property
Index: modules/open-science-observatory-ui/trunk/src/assets/img/icons/datasets-icon-white.svg
===================================================================
Cannot display: file marked as a binary type.
svn:mime-type = image/svg+xml
Index: modules/open-science-observatory-ui/trunk/src/assets/img/icons/datasets-icon-white.svg
===================================================================
--- modules/open-science-observatory-ui/trunk/src/assets/img/icons/datasets-icon-white.svg	(nonexistent)
+++ modules/open-science-observatory-ui/trunk/src/assets/img/icons/datasets-icon-white.svg	(revision 58853)

Property changes on: modules/open-science-observatory-ui/trunk/src/assets/img/icons/datasets-icon-white.svg
___________________________________________________________________
Added: svn:mime-type
## -0,0 +1 ##
+image/svg+xml
\ No newline at end of property
Index: modules/open-science-observatory-ui/trunk/src/assets/img/icons/software-icon-white.svg
===================================================================
Cannot display: file marked as a binary type.
svn:mime-type = image/svg+xml
Index: modules/open-science-observatory-ui/trunk/src/assets/img/icons/software-icon-white.svg
===================================================================
--- modules/open-science-observatory-ui/trunk/src/assets/img/icons/software-icon-white.svg	(nonexistent)
+++ modules/open-science-observatory-ui/trunk/src/assets/img/icons/software-icon-white.svg	(revision 58853)

Property changes on: modules/open-science-observatory-ui/trunk/src/assets/img/icons/software-icon-white.svg
___________________________________________________________________
Added: svn:mime-type
## -0,0 +1 ##
+image/svg+xml
\ No newline at end of property
Index: modules/open-science-observatory-ui/trunk/src/assets/img/icons/publications-icon-white.svg
===================================================================
Cannot display: file marked as a binary type.
svn:mime-type = image/svg+xml
Index: modules/open-science-observatory-ui/trunk/src/assets/img/icons/publications-icon-white.svg
===================================================================
--- modules/open-science-observatory-ui/trunk/src/assets/img/icons/publications-icon-white.svg	(nonexistent)
+++ modules/open-science-observatory-ui/trunk/src/assets/img/icons/publications-icon-white.svg	(revision 58853)

Property changes on: modules/open-science-observatory-ui/trunk/src/assets/img/icons/publications-icon-white.svg
___________________________________________________________________
Added: svn:mime-type
## -0,0 +1 ##
+image/svg+xml
\ No newline at end of property
