Project

General

Profile

« Previous | Next » 

Revision 58923

Finished the charts for the overview tab of the country page

View differences:

country-page.component.html
22 22
                  <img src="../../../assets/img/flags/{{countryCode | lowercase}}-flag-round.png" class="flag-image" width="132" height="132">
23 23
                  <div class="uk-inline uk-margin-left">
24 24
                    <h1>{{countryPageOverviewData.name}}</h1>
25
                    <span class="lastUpdateInfo">Info Last Updated: 21 May 2020</span>
25
                    <span class="lastUpdateInfo">Info Last Updated: </span>
26
                    <span *ngIf="lastUpdateDate" class="lastUpdateInfo">{{lastUpdateDate}}</span>
26 27
                  </div>
27 28
                </div>
28 29

  
......
513 514

  
514 515
        <!--LAPTOP & PAD LANDSCAPE-->
515 516
        <ul class="uk-visible@m uk-tab uk-tab-large uk-flex-center" data-uk-tab="{connect:'#team_tabbed',animation: 'slide-bottom'}">
516
          <li class="uk-active" aria-expanded="true"><a href="#">Overview</a></li>
517
          <li aria-expanded="false"><a href="#">Open Science</a></li>
517
          <li class="uk-active" aria-expanded="true"><a (click)="changeTopView('overview')">Overview</a></li>
518
          <li aria-expanded="false"><a (click)="changeTopView('openScience')">Open Science</a></li>
518 519
          <li class="uk-disabled" aria-expanded="false"><a href="#" data-uk-tooltip="{title: Stay tuned..; pos: top-left}">Collaboration</a></li>
519 520
          <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Impact</a></li>
520 521
          <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Innovation</a></li>
......
523 524

  
524 525
        <!--MOBILE & PAD PORTRAIT-->
525 526
        <ul class="uk-hidden@m uk-tab" data-uk-tab="{connect:'#team_tabbed',animation: 'slide-bottom'}">
526
          <li class="uk-active" aria-expanded="true"><a href="#">Overview</a></li>
527
          <li aria-expanded="false"><a href="#">Open Science</a></li>
527
          <li class="uk-active" aria-expanded="true"><a (click)="changeTopView('overview')">Overview</a></li>
528
          <li aria-expanded="false"><a (click)="changeTopView('openScience')">Open Science</a></li>
528 529
          <li class="uk-disabled" aria-expanded="false"><a href="#" data-uk-tooltip="{title: Stay tuned..; pos: top-left}">Collaboration</a></li>
529 530
          <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Impact</a></li>
530 531
          <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Innovation</a></li>
......
537 538
          <li aria-hidden="false" class="uk-active" style="animation-duration: 200ms;">
538 539
            <div class="uk-margin tabContent">
539 540

  
540
              <!--<div class="uk-grid uk-child-width-1-4 uk-grid-match">-->
541
              <!--<div class="md-card">-->
542
              <!--<div class="md-card-content">-->
543
              <!--22.888-->
544
              <!--</div>-->
545
              <!--</div>-->
546
              <!--<div class="md-card">-->
547
              <!--<div class="md-card-content">-->
548
              <!--30% open access-->
549
              <!--</div>-->
550
              <!--</div>-->
551
              <!--<div class="md-card">-->
552
              <!--<div class="md-card-content">-->
553
              <!--18.165 closed access-->
554
              <!--</div>-->
555
              <!--</div>-->
556
              <!--<div class="md-card">-->
557
              <!--<div class="md-card-content">-->
558
              <!--22.888-->
559
              <!--</div>-->
560
              <!--</div>-->
561
              <!--</div>-->
541
              <div *ngIf="countryPageOAData" class="uk-grid uk-child-width-1-4@m uk-child-width-1-4@l uk-child-width-1-2@s uk-grid-match">
562 542

  
563
              <!--<div class="uk-grid uk-child-width-1-1">-->
543
                <div>
544
                  <div class="md-card">
545
                    <div class="md-card-content">
546
                      <svg *ngIf="countryPageOAData.publicationsAffiliated?.percentage" viewBox="0 0 36 36" class="circular-chart publications">
547
                        <path class="circle-bg" d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"></path>
548
                        <path class="circle" attr.stroke-dasharray="{{countryPageOAData.publicationsAffiliated.percentage}}, 100" d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"></path>
549
                        <text x="18" y="20.35" class="percentage">{{countryPageOAData.publicationsAffiliated.percentage | number : '1.0-1'}}%</text>
550
                      </svg>
551
                      <div class="uk-margin-small-top uk-text-center">OA publications</div>
552
                    </div>
553
                  </div>
554
                </div>
564 555

  
565
              <!--<div>-->
566
              <!--<div class="md-card chartCard">-->
567
              <!--<div class="md-card-content">-->
568
              <!--<iframe width="100%" height="550" src="http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22eCharts%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%22select%22%3A%5B%7B%22field%22%3A%22publication%22%2C%22aggregate%22%3A%22count%22%7D%2C%7B%22field%22%3A%22publication.classification%22%2C%22aggregate%22%3Anull%7D%5D%2C%22filters%22%3A%5B%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22publication.organization.country.continent%22%2C%22type%22%3A%22%3D%22%2C%22values%22%3A%5B%22Europe%22%5D%7D%5D%2C%22op%22%3A%22AND%22%7D%2C%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22publication.classification%22%2C%22type%22%3A%22!%3D%22%2C%22values%22%3A%5B%220041%22%5D%7D%2C%7B%22field%22%3A%22publication.classification%22%2C%22type%22%3A%22!%3D%22%2C%22values%22%3A%5B%220043%22%5D%7D%2C%7B%22field%22%3A%22publication.classification%22%2C%22type%22%3A%22!%3D%22%2C%22values%22%3A%5B%220044%22%5D%7D%2C%7B%22field%22%3A%22publication.classification%22%2C%22type%22%3A%22!%3D%22%2C%22values%22%3A%5B%22Unknown%22%5D%7D%5D%2C%22op%22%3A%22AND%22%7D%5D%2C%22entity%22%3A%22publication%22%2C%22profile%22%3A%22OpenAIRE%20All-inclusive%22%2C%22limit%22%3A%2230%22%7D%7D%5D%2C%22chart%22%3A%7B%7D%2C%22title%22%3A%7B%22text%22%3A%22Publications%20by%20type%22%7D%2C%22yAxis%22%3A%7B%22name%22%3A%22publications%22%7D%2C%22xAxis%22%3A%7B%22name%22%3A%22type%22%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22toolbox%22%3A%7B%22show%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Atrue%7D%2C%22stacking%22%3Afalse%7D%7D%2C%22legend%22%3A%7B%22show%22%3Atrue%2C%22orient%22%3A%22horizontal%22%2C%22left%22%3A%22center%22%2C%22top%22%3A%22bottom%22%7D%2C%22tooltip%22%3A%7B%22show%22%3Atrue%7D%2C%22backgroundColor%22%3A%22%23FFFFFFFF%22%7D%7D"></iframe>-->
569
              <!--</div>-->
570
              <!--</div>-->
571
              <!--</div>-->
556
                <div>
557
                  <div class="md-card">
558
                    <div class="md-card-content">
559
                      <svg *ngIf="countryPageOAData.datasetsAffiliated?.percentage" viewBox="0 0 36 36" class="circular-chart datasets">
560
                        <path class="circle-bg" d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"></path>
561
                        <path class="circle" attr.stroke-dasharray="{{countryPageOAData.datasetsAffiliated.percentage}}, 100" d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"></path>
562
                        <text x="18" y="20.35" class="percentage">{{countryPageOAData.datasetsAffiliated.percentage | number : '1.0-1'}}%</text>
563
                      </svg>
564
                      <div class="uk-margin-small-top uk-text-center">OA datasets</div>
565
                    </div>
566
                  </div>
567
                </div>
572 568

  
573
              <!--</div>-->
569
                <div>
570
                  <div class="md-card">
571
                    <div class="md-card-content">
572
                      <svg *ngIf="countryPageOAData.software?.percentage" viewBox="0 0 36 36" class="circular-chart software">
573
                        <path class="circle-bg" d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"></path>
574
                        <path class="circle" attr.stroke-dasharray="{{countryPageOAData.software.percentage}}, 100" d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"></path>
575
                        <text x="18" y="20.35" class="percentage">{{countryPageOAData.software.percentage | number : '1.0-1'}}%</text>
576
                      </svg>
577
                      <div class="uk-margin-small-top uk-text-center">OS software</div>
578
                    </div>
579
                  </div>
580
                </div>
574 581

  
575
              <!--<div class="uk-grid uk-grid-row-medium uk-margin-small-top uk-child-width-1-2@m uk-child-width-1-2@l uk-child-width-1-1@s">-->
582
                <div>
583
                  <div class="md-card">
584
                    <div class="md-card-content">
585
                      <svg *ngIf="countryPageOAData.other?.percentage" viewBox="0 0 36 36" class="circular-chart other">
586
                        <path class="circle-bg" d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"></path>
587
                        <path class="circle" attr.stroke-dasharray="{{countryPageOAData.other.percentage}}, 100" d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"></path>
588
                        <text x="18" y="20.35" class="percentage">{{countryPageOAData.other.percentage | number : '1.0-1'}}%</text>
589
                      </svg>
590
                      <div class="uk-margin-small-top uk-text-center">OA other research products</div>
591
                    </div>
592
                  </div>
593
                </div>
576 594

  
577
              <!--<div class="uk-grid-margin">-->
578
              <!--<div class="md-card chartCard">-->
579
              <!--<div class="md-card-content">-->
580
              <!--<iframe width="100%" height="350" src="http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22eCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Publications%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.publications%22%7D%7D%2C%7B%22name%22%3A%22OA%20Publications%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.publications.oa%22%7D%7D%5D%2C%22chart%22%3A%7B%7D%2C%22title%22%3A%7B%22text%22%3A%22Publications%20over%20the%20years%22%7D%2C%22yAxis%22%3A%7B%22name%22%3A%22publications%22%7D%2C%22xAxis%22%3A%7B%22name%22%3A%22year%22%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22toolbox%22%3A%7B%22show%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Atrue%7D%2C%22stacking%22%3Atrue%7D%7D%2C%22legend%22%3A%7B%22show%22%3Atrue%2C%22orient%22%3A%22horizontal%22%2C%22left%22%3A%22center%22%2C%22top%22%3A%22bottom%22%7D%2C%22tooltip%22%3A%7B%22show%22%3Atrue%7D%2C%22backgroundColor%22%3A%22%23FFFFFFFF%22%7D%7D"></iframe>-->
581
              <!--</div>-->
582
              <!--</div>-->
583
              <!--</div>-->
595
              </div>
584 596

  
585
              <!--<div class="uk-grid-margin">-->
586
              <!--<div class="md-card chartCard">-->
587
              <!--<div class="md-card-content">-->
588
              <!--<iframe width="100%" height="350" src="http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22eCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Datasets%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.datasets%22%7D%7D%2C%7B%22name%22%3A%22OA%20Datasets%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.datasets.oa%22%7D%7D%5D%2C%22chart%22%3A%7B%7D%2C%22title%22%3A%7B%22text%22%3A%22Datasets%20over%20the%20years%22%7D%2C%22yAxis%22%3A%7B%22name%22%3A%22datasets%22%7D%2C%22xAxis%22%3A%7B%22name%22%3A%22year%22%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22toolbox%22%3A%7B%22show%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Atrue%7D%2C%22stacking%22%3Atrue%7D%7D%2C%22legend%22%3A%7B%22show%22%3Atrue%2C%22orient%22%3A%22horizontal%22%2C%22left%22%3A%22center%22%2C%22top%22%3A%22bottom%22%7D%2C%22tooltip%22%3A%7B%22show%22%3Atrue%7D%2C%22backgroundColor%22%3A%22%23FFFFFFFF%22%7D%7D"></iframe>-->
589
              <!--</div>-->
590
              <!--</div>-->
591
              <!--</div>-->
597
              <div class="uk-grid uk-grid-row-medium uk-margin-small-top uk-child-width-1-2@m uk-child-width-1-2@l uk-child-width-1-1@s">
592 598

  
593
              <!--<div class="uk-grid-margin">-->
594
              <!--<div class="md-card chartCard">-->
595
              <!--<div class="md-card-content">-->
596
              <!--<iframe width="100%" height="350" src="http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22eCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Software%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.software%22%7D%7D%2C%7B%22name%22%3A%22OA%20Software%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.software.oa%22%7D%7D%5D%2C%22chart%22%3A%7B%7D%2C%22title%22%3A%7B%22text%22%3A%22Software%20over%20the%20years%22%7D%2C%22yAxis%22%3A%7B%22name%22%3A%22software%22%7D%2C%22xAxis%22%3A%7B%22name%22%3A%22year%22%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22toolbox%22%3A%7B%22show%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Atrue%7D%2C%22stacking%22%3Atrue%7D%7D%2C%22legend%22%3A%7B%22show%22%3Atrue%2C%22orient%22%3A%22horizontal%22%2C%22left%22%3A%22center%22%2C%22top%22%3A%22bottom%22%7D%2C%22tooltip%22%3A%7B%22show%22%3Atrue%7D%2C%22backgroundColor%22%3A%22%23FFFFFFFF%22%7D%7D"></iframe>-->
597
              <!--</div>-->
598
              <!--</div>-->
599
              <!--</div>-->
599
                <div class="uk-grid-margin">
600
                  <div class="md-card chartCard">
601
                    <div class="md-card-content">
602
                      <iframe *ngIf="oaNonOAPublicationsTimelineChartURL" width="100%" height="350" [src]="oaNonOAPublicationsTimelineChartURL"></iframe>
603
                    </div>
604
                  </div>
605
                </div>
600 606

  
601
              <!--<div class="uk-grid-margin">-->
602
              <!--<div class="md-card chartCard">-->
603
              <!--<div class="md-card-content">-->
604
              <!--<iframe width="100%" height="350" src="http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22eCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Other%20Research%20Products%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.other%22%7D%7D%2C%7B%22name%22%3A%22OA%20Other%20Research%20Products%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.other.oa%22%7D%7D%5D%2C%22chart%22%3A%7B%7D%2C%22title%22%3A%7B%22text%22%3A%22Other%20research%20products%20over%20the%20years%22%7D%2C%22yAxis%22%3A%7B%22name%22%3A%22other%20research%20products%22%7D%2C%22xAxis%22%3A%7B%22name%22%3A%22year%22%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22toolbox%22%3A%7B%22show%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Atrue%7D%2C%22stacking%22%3Atrue%7D%7D%2C%22legend%22%3A%7B%22show%22%3Atrue%2C%22orient%22%3A%22horizontal%22%2C%22left%22%3A%22center%22%2C%22top%22%3A%22bottom%22%7D%2C%22tooltip%22%3A%7B%22show%22%3Atrue%7D%2C%22backgroundColor%22%3A%22%23FFFFFFFF%22%7D%7D"></iframe>-->
605
              <!--</div>-->
606
              <!--</div>-->
607
              <!--</div>-->
607
                <div class="uk-grid-margin">
608
                  <div class="md-card chartCard">
609
                    <div class="md-card-content">
610
                      <iframe *ngIf="oaNonOADatasetsTimelineChartURL" width="100%" height="350" [src]="oaNonOADatasetsTimelineChartURL"></iframe>
611
                    </div>
612
                  </div>
613
                </div>
608 614

  
615
                <div class="uk-grid-margin">
616
                  <div class="md-card chartCard">
617
                    <div class="md-card-content">
618
                      <iframe *ngIf="oaNonOASoftwareTimelineChartURL" width="100%" height="350" [src]="oaNonOASoftwareTimelineChartURL"></iframe>
619
                    </div>
620
                  </div>
621
                </div>
609 622

  
610
              <!--</div>-->
623
                <div class="uk-grid-margin">
624
                  <div class="md-card chartCard">
625
                    <div class="md-card-content">
626
                      <iframe *ngIf="oaNonOAOtherTimelineChartURL" width="100%" height="350" [src]="oaNonOAOtherTimelineChartURL"></iframe>
627
                    </div>
628
                  </div>
629
                </div>
611 630

  
612 631

  
632
              </div>
613 633

  
614
              <!--<app-countries-table [isPercentage]="false" [type]="'overview'" [countries]="overviewData.countries"></app-countries-table>-->
634
              <div class="uk-grid uk-child-width-1-3@m uk-child-width-1-3@l uk-child-width-1-1@s">
635

  
636
                <div class="uk-grid-margin">
637
                  <div class="md-card chartCard">
638
                    <div class="md-card-content">
639
                      <iframe *ngIf="publicationsByDatasourceChartURL" width="100%" height="550" [src]="publicationsByDatasourceChartURL"></iframe>
640
                    </div>
641
                  </div>
642
                </div>
643

  
644
                <div class="uk-grid-margin">
645
                  <div class="md-card chartCard">
646
                    <div class="md-card-content">
647
                      <iframe *ngIf="publicationsByOrganizationChartURL" width="100%" height="550" [src]="publicationsByOrganizationChartURL"></iframe>
648
                    </div>
649
                  </div>
650
                </div>
651

  
652
                <div class="uk-grid-margin">
653
                  <div class="md-card chartCard">
654
                    <div class="md-card-content">
655
                      <app-treemap-highchart *ngIf="publicationsByFunderData" [chartTitle]="'OA Publications by funder'"
656
                                             [chartData]="publicationsByFunderData" [color]="'#F181AE'"></app-treemap-highchart>
657
                    </div>
658
                  </div>
659
                </div>
660

  
661
                <div class="uk-grid-margin">
662
                  <div class="md-card chartCard">
663
                    <div class="md-card-content">
664
                      <iframe *ngIf="datasetsByDatasourceChartURL" width="100%" height="550" [src]="datasetsByDatasourceChartURL"></iframe>
665
                    </div>
666
                  </div>
667
                </div>
668

  
669
                <div class="uk-grid-margin">
670
                  <div class="md-card chartCard">
671
                    <div class="md-card-content">
672
                      <iframe *ngIf="datasetsByOrganizationChartURL" width="100%" height="550" [src]="datasetsByOrganizationChartURL"></iframe>
673
                    </div>
674
                  </div>
675
                </div>
676

  
677
                <div class="uk-grid-margin">
678
                  <div class="md-card chartCard">
679
                    <div class="md-card-content">
680
                      <app-treemap-highchart *ngIf="datasetsByFunderData" [chartTitle]="'OA Datasets by funder'"
681
                                             [chartData]="datasetsByFunderData" [color]="'#BB9CE6'"></app-treemap-highchart>
682
                    </div>
683
                  </div>
684
                </div>
685

  
686
                <div class="uk-grid-margin">
687
                  <div class="md-card chartCard">
688
                    <div class="md-card-content">
689
                      <iframe *ngIf="softwareByDatasourceChartURL" width="100%" height="550" [src]="softwareByDatasourceChartURL"></iframe>
690
                    </div>
691
                  </div>
692
                </div>
693

  
694
                <div class="uk-grid-margin">
695
                  <div class="md-card chartCard">
696
                    <div class="md-card-content">
697
                      <iframe *ngIf="softwareByOrganizationChartURL" width="100%" height="550" [src]="softwareByOrganizationChartURL"></iframe>
698
                    </div>
699
                  </div>
700
                </div>
701

  
702
                <div class="uk-grid-margin">
703
                  <div class="md-card chartCard">
704
                    <div class="md-card-content">
705
                      <app-treemap-highchart *ngIf="softwareByFunderData" [chartTitle]="'OS Software by funder'"
706
                                             [chartData]="softwareByFunderData" [color]="'#C2155A'"></app-treemap-highchart>
707
                    </div>
708
                  </div>
709
                </div>
710

  
711
                <div class="uk-grid-margin">
712
                  <div class="md-card chartCard">
713
                    <div class="md-card-content">
714
                      <iframe *ngIf="otherByDatasourceChartURL" width="100%" height="550" [src]="otherByDatasourceChartURL"></iframe>
715
                    </div>
716
                  </div>
717
                </div>
718

  
719
                <div class="uk-grid-margin">
720
                  <div class="md-card chartCard">
721
                    <div class="md-card-content">
722
                      <iframe *ngIf="otherByOrganizationChartURL" width="100%" height="550" [src]="otherByOrganizationChartURL"></iframe>
723
                    </div>
724
                  </div>
725
                </div>
726

  
727
                <div class="uk-grid-margin">
728
                  <div class="md-card chartCard">
729
                    <div class="md-card-content">
730
                      <app-treemap-highchart *ngIf="otherByFunderData" [chartTitle]="'OA Other research products by funder'"
731
                                             [chartData]="otherByFunderData" [color]="'#00CCCC'"></app-treemap-highchart>
732
                    </div>
733
                  </div>
734
                </div>
735

  
736
              </div>
737

  
738
              <div class="uk-grid uk-child-width-1-1@m uk-child-width-1-1@l uk-child-width-1-1@s">
739

  
740
                <div class="uk-grid-margin">
741
                  <div class="md-card chartCard">
742
                    <div class="md-card-content">
743
                      <iframe *ngIf="resultsByTypeOANonOAChartURL" width="100%" height="550" [src]="resultsByTypeOANonOAChartURL"></iframe>
744
                    </div>
745
                  </div>
746
                </div>
747

  
748
              </div>
749

  
615 750
            </div>
616 751
          </li>
617 752

  
......
621 756

  
622 757
              <ul class="uk-subnav uk-subnav-pill dataView uk-flex uk-flex-center" data-uk-switcher="{connect:'#switcher-content-a-fade', animation: 'fade'}">
623 758
                <li aria-expanded="true" class="uk-active">
624
                  <a class="publicationsSubnav" (click)="changeView('publications')" uk-tooltip="title: Publication; duration: 2000">
759
                  <a class="publicationsSubnav" (click)="changeInnerView('publications')" uk-tooltip="title: Publication; duration: 2000">
625 760
                    <img src="../../../assets/img/icons/publications-icon.svg" width="15">
626 761
                  </a>
627 762
                </li>
628 763
                <li aria-expanded="false" class="">
629
                  <a class="datasetsSubnav" (click)="changeView('datasets')" uk-tooltip="title: Datasets; duration: 2000">
764
                  <a class="datasetsSubnav" (click)="changeInnerView('datasets')" uk-tooltip="title: Datasets; duration: 2000">
630 765
                    <img src="../../../assets/img/icons/datasets-icon.svg" width="15">
631 766
                  </a>
632 767
                </li>
633 768
                <li aria-expanded="false" class="">
634
                  <a class="softwareSubnav" (click)="changeView('software')" uk-tooltip="title: Software; duration: 2000">
769
                  <a class="softwareSubnav" (click)="changeInnerView('software')" uk-tooltip="title: Software; duration: 2000">
635 770
                    <img src="../../../assets/img/icons/software-icon.svg" width="15">
636 771
                  </a>
637 772
                </li>
638 773
                <li aria-expanded="false" class="">
639
                  <a class="otherSubnav" (click)="changeView('other')" uk-tooltip="title: Other research products; duration: 2000">
774
                  <a class="otherSubnav" (click)="changeInnerView('other')" uk-tooltip="title: Other research products; duration: 2000">
640 775
                    <img src="../../../assets/img/icons/other-icon.svg" width="15">
641 776
                  </a>
642 777
                </li>

Also available in: Unified diff