diff --git a/src/features/feature-view/feature-view.component.html b/src/features/feature-view/feature-view.component.html index 7bbe648781733121949f45fcd7e6d2741f9c9f6f..e52f026edabe5b89f5d265cda81f299637991a38 100644 --- a/src/features/feature-view/feature-view.component.html +++ b/src/features/feature-view/feature-view.component.html @@ -47,6 +47,21 @@ </mat-card-content> </mat-card> +<!-- radar special view --> +<ng-template [ngIf]="polar$ | async" let-polar> + <kg-dataset-dumb-radar + [radar]="polar" + [attr.kg-ds-prv-darkmode]="darktheme$ | async"> + </kg-dataset-dumb-radar> +</ng-template> + +<!-- line special view --> +<ng-template [ngIf]="linear$ | async" let-linear> + <kg-dataset-dumb-line + [profileBs]="linear" + [attr.kg-ds-prv-darkmode]="darktheme$ | async"> + </kg-dataset-dumb-line> +</ng-template> <!-- tabular special view --> <ng-template [ngIf]="tabular$ | async" let-tabular> diff --git a/src/features/feature-view/feature-view.component.scss b/src/features/feature-view/feature-view.component.scss index 733e12f491703e2a25badbdc40f9b3cf89526482..d767661ba1a3b8ea00e948c39b8c9b8b542701b8 100644 --- a/src/features/feature-view/feature-view.component.scss +++ b/src/features/feature-view/feature-view.component.scss @@ -15,3 +15,10 @@ spinner-cmp margin: auto; margin-left: 0.5rem; } + +kg-dataset-dumb-radar, +kg-dataset-dumb-line +{ + display: block; + max-height: 24rem; +} diff --git a/src/features/feature-view/feature-view.component.ts b/src/features/feature-view/feature-view.component.ts index 9cd37f0ac72e1b127d72c03663b222cbaaf9d438..bf6c7916ad45f2f0a821127bb41a4c0cc3f0fa83 100644 --- a/src/features/feature-view/feature-view.component.ts +++ b/src/features/feature-view/feature-view.component.ts @@ -1,8 +1,9 @@ -import { ChangeDetectionStrategy, Component, Input, OnChanges, OnInit } from '@angular/core'; +import { ChangeDetectionStrategy, Component, Inject, Input, OnChanges } from '@angular/core'; import { BehaviorSubject, Observable } from 'rxjs'; -import { map } from 'rxjs/operators'; +import { filter, map } from 'rxjs/operators'; import { SAPI } from 'src/atlasComponents/sapi/sapi.service'; import { Feature, TabularFeature, VoiFeature } from 'src/atlasComponents/sapi/sxplrTypes'; +import { DARKTHEME } from 'src/util/injectionTokens'; function isTabularData(feature: unknown): feature is TabularFeature<number|string|number[]> { return !!feature['index'] && !!feature['columns'] @@ -12,6 +13,18 @@ function isVoiData(feature: unknown): feature is VoiFeature { return !!feature['bbox'] } + +type PolarPlotData = { + receptor: { + label: string + } + density: { + mean: number + sd: number + unit: string + } +} + @Component({ selector: 'sxplr-feature-view', templateUrl: './feature-view.component.html', @@ -32,7 +45,42 @@ export class FeatureViewComponent implements OnChanges { ? ['index', ...data.columns] : []), ) - constructor(private sapi: SAPI) { } + + polar$: Observable<PolarPlotData[]> = this.tabular$.pipe( + filter(v => v?.name.includes("ReceptorDensityFingerprint")), + map(v => { + return v.index.map((receptor, idx) => ({ + receptor: { + label: receptor + }, + density: { + mean: v.data[idx][0] as number, + sd: v.data[idx][1] as number, + unit: 'fmol/mg' + } + })) + }) + ) + + linear$: Observable<Record<number, number>> = this.tabular$.pipe( + filter(v => v && v.name.includes("ReceptorDensityProfile")), + map(v => { + const returnLbl: Record<number, number> = {} + + v.index.forEach((label, idx) => { + const val = v.data[idx][0] + if (typeof val === 'number') { + returnLbl[Math.round(Number(label)*100)] = val + } + }) + return returnLbl + }) + ) + + constructor( + private sapi: SAPI, + @Inject(DARKTHEME) public darktheme$: Observable<boolean>, + ) { } ngOnChanges(): void { diff --git a/src/features/module.ts b/src/features/module.ts index 3795cf74814af3283e23d2b3cd22c39af8419d64..dc9843c177063c1c7f7cc0c67a7ab94404acdc2d 100644 --- a/src/features/module.ts +++ b/src/features/module.ts @@ -1,5 +1,5 @@ import { CommonModule } from "@angular/common"; -import { NgModule } from "@angular/core"; +import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from "@angular/core"; import { MatCardModule } from "@angular/material/card"; import { MatRippleModule } from "@angular/material/core"; import { MatExpansionModule } from "@angular/material/expansion"; @@ -56,6 +56,9 @@ import { NgLayerCtlModule } from "src/viewerModule/nehuba/ngLayerCtlModule/modul exports: [ EntryComponent, FeatureViewComponent, + ], + schemas: [ + CUSTOM_ELEMENTS_SCHEMA, ] }) export class FeatureModule{} \ No newline at end of file diff --git a/src/main-common.ts b/src/main-common.ts index f927f25516b9280f7f21416551c27a338117177e..9e3b5612eb1e2597deb5ae361d6dc457cb897996 100644 --- a/src/main-common.ts +++ b/src/main-common.ts @@ -34,7 +34,7 @@ import { MainModule } from './main.module'; import { environment } from 'src/environments/environment' const { PRODUCTION, VERSION, GIT_HASH } = environment if (PRODUCTION) enableProdMode() -if (PRODUCTION) { console.log(`Siibra Explorer: ${VERSION}::${GIT_HASH}`) } +console.log(`Siibra Explorer: ${VERSION}::${GIT_HASH}`) platformBrowserDynamic().bootstrapModule(MainModule)