diff --git a/.storybook/preview-head.html b/.storybook/preview-head.html
index ca4966cf9a9766e877af1038448be7902572b7f1..392e96571a4090735d8407bf9a93592d0344d34b 100644
--- a/.storybook/preview-head.html
+++ b/.storybook/preview-head.html
@@ -10,4 +10,4 @@
}
</style>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
-<script type="module" src="https://unpkg.com/hbp-connectivity-component@0.6.1/dist/connectivity-component/connectivity-component.js" defer></script>
+<script type="module" src="https://unpkg.com/hbp-connectivity-component@0.6.2/dist/connectivity-component/connectivity-component.js" defer></script>
diff --git a/src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.component.ts b/src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.component.ts
index cac404103d18848006a3b27c969d322e111bafcc..264e82a85671380f49003d2d3371fba156f015c0 100644
--- a/src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.component.ts
+++ b/src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.component.ts
@@ -89,6 +89,8 @@ export class ConnectivityBrowserComponent implements AfterViewInit, OnDestroy {
public regionHemisphere: string = null
public selectedDataset: any
public connectionsString: string
+ public logConnectionsString: string
+ public pureConnections: any
public connectedAreas: BehaviorSubject<any[]> = new BehaviorSubject([])
private subscriptions: Subscription[] = []
@@ -96,7 +98,6 @@ export class ConnectivityBrowserComponent implements AfterViewInit, OnDestroy {
private regionIndexInMatrix = -1
public defaultColorMap: Map<string, Map<number, { red: number, green: number, blue: number }>>
public matrixString: string
- public noDataReceived = false
public fetching: boolean
public numberOfDatasets: number
public connectivityLayerId = 'connectivity-colormap-id'
@@ -104,6 +105,9 @@ export class ConnectivityBrowserComponent implements AfterViewInit, OnDestroy {
public pageNumber: number
private customLayerEnabled: boolean
+ public logDisabled: boolean = true
+ public logChecked: boolean = true
+
@ViewChild('connectivityComponent', {read: ElementRef}) public connectivityComponentElement: ElementRef<any>
@ViewChild('fullConnectivityGrid') public fullConnectivityGridElement: ElementRef<any>
@@ -230,20 +234,36 @@ export class ConnectivityBrowserComponent implements AfterViewInit, OnDestroy {
this.regionIndexInMatrix = (matrixData.columns as Array<string>).findIndex(md => md === this.regionName)
this.sapi.processNpArrayData<PARSE_TYPEDARRAY.RAW_ARRAY>(matrixData.matrix, PARSE_TYPEDARRAY.RAW_ARRAY)
.then(matrix => {
- const areas = {}
- matrix.rawArray[this.regionIndexInMatrix].forEach((value, i) => {
- areas[matrixData.columns[i]] = value
- })
+ const regionProfile = matrix.rawArray[this.regionIndexInMatrix]
+
+ const maxStrength = Math.max(...regionProfile)
+ this.logChecked = maxStrength > 1
+ this.logDisabled = maxStrength <= 1
+
+ const areas = regionProfile.reduce((p, c, i) => ({...p, [matrixData.columns[i]]: c}), {})
+ // const areas = {}
+ // regionProfile.forEach((value, i) => {
+ // areas[matrixData.columns[i]] = value
+ // })
+ this.pureConnections = areas
this.connectionsString = JSON.stringify(areas)
this.connectedAreas.next(this.formatConnections(areas))
-
this.setCustomLayer()
+
this.matrixString = JSON.stringify(matrixData.columns.map((mc, i) => ([mc, ...matrix.rawArray[i]])))
this.changeDetectionRef.detectChanges()
})
}
+
+ changeLog(checked) {
+ this.logChecked = checked
+ this.connectedAreas.next(this.formatConnections(this.pureConnections))
+ this.connectivityComponentElement.nativeElement.toggleShowLog()
+ this.setCustomLayer()
+ }
+
//ToDo navigateRegion action does not work any more
navigateToRegion(region: SapiRegionModel) {
this.store$.dispatch(
@@ -271,38 +291,23 @@ export class ConnectivityBrowserComponent implements AfterViewInit, OnDestroy {
this.subscriptions.forEach(s => s.unsubscribe())
}
- private floatConnectionNumbers
private formatConnections = (areas) => {
const cleanedObj = Object.keys(areas)
.map(key => ({name: key, numberOfConnections: areas[key]}))
.filter(f => f.numberOfConnections > 0)
.sort((a, b) => +b.numberOfConnections - +a.numberOfConnections)
- this.floatConnectionNumbers = cleanedObj[0].numberOfConnections <= 1
- const logMax = this.floatConnectionNumbers ? cleanedObj[0].numberOfConnections : Math.log(cleanedObj[0].numberOfConnections)
+ const logMax = this.logChecked ? Math.log(cleanedObj[0].numberOfConnections) : cleanedObj[0].numberOfConnections
const colorAreas = []
- cleanedObj.forEach((a, i) => {
- if (a.name.includes(' - both hemispheres')) {
-
- const rightTitle = a.name.replace(' - both hemispheres', ' - right hemisphere')
- const rightHemisphereItemToAdd = {...a, name: rightTitle}
- cleanedObj.splice(i + 1, 0, rightHemisphereItemToAdd)
-
- cleanedObj[i] = {
- ...cleanedObj[i],
- name: cleanedObj[i].name.replace(' - both hemispheres', ' - left hemisphere')
- }
- }
- })
cleanedObj.forEach((a) => {
colorAreas.push({
...a,
color: {
- r: this.colormap_red(this.floatConnectionNumbers ? a.numberOfConnections : Math.log(a.numberOfConnections) / logMax),
- g: this.colormap_green(this.floatConnectionNumbers ? a.numberOfConnections : Math.log(a.numberOfConnections) / logMax),
- b: this.colormap_blue(this.floatConnectionNumbers ? a.numberOfConnections : Math.log(a.numberOfConnections) / logMax)
- }
+ r: this.colormap_red((this.logChecked ? Math.log(a.numberOfConnections) : a.numberOfConnections) / logMax ),
+ g: this.colormap_green((this.logChecked ? Math.log(a.numberOfConnections) : a.numberOfConnections) / logMax ),
+ b: this.colormap_blue((this.logChecked ? Math.log(a.numberOfConnections) : a.numberOfConnections) / logMax )
+ },
})
})
return colorAreas
diff --git a/src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.stories.ts b/src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.stories.ts
index 47c3ced7397945c9934ab9f92fcb00c5fcf51d90..34e44e557187979d1654ebad943fa9e7ef924b59 100644
--- a/src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.stories.ts
+++ b/src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.stories.ts
@@ -105,6 +105,7 @@ class ExampleConnectivityBrowserWrapper {
areas[matrixData.columns[i]] = value
})
this.connectionsString = JSON.stringify(areas)
+ this.cdf.detectChanges()
})
})
}
diff --git a/src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.template.html b/src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.template.html
index 543ead827dfaff8ddb549d114896385ca7fda324..705a6fd9bcdc33726e5b18a77144af40609bdbd2 100644
--- a/src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.template.html
+++ b/src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.template.html
@@ -48,34 +48,28 @@
</div>
<div class="d-flex justify-content-center">
- <mat-spinner *ngIf="fetching"></mat-spinner>
+ <mat-spinner *ngIf="fetching"></mat-spinner>
</div>
- <hbp-connectivity-matrix-row
- #connectivityComponent
- *ngIf="regionName && !fetching"
- [region]="regionName + (regionHemisphere? ' - ' + regionHemisphere : '')"
- [connections]="connectionsString"
- theme="dark"
- show-export="true"
- show-source="false"
- show-title="false"
- show-toolbar="false"
- show-description="false"
- show-dataset-name="false"
- custom-dataset-selector="true"
- tools_showlog="true"
- [tools_custom]='[{"name": "exportslot", "type": "slot"}]'
- hide-export-view="true">
+ <div class="d-flex align-items-center" *ngIf="regionName && !fetching">
+ <mat-checkbox class="mr-2"
+ [checked]="logChecked"
+ (change)="changeLog($event.checked)"
+ [disabled]="logDisabled">Log 10</mat-checkbox>
+ <button mat-button [matMenuTriggerFor]="exportMenu"
+ [disabled]="!connectedAreas.value">
+ <i class="fas fa-download mb-2 mr-2"></i>
+ <label>Export</label>
+ </button>
+ </div>
- <div slot="exportslot">
- <button mat-icon-button
- [disabled]="noDataReceived"
- (click)="exportConnectivityProfile()"
- matTooltip="Export connectivity profile">
- <i class="fas fa-download mb-2"></i>
- </button>
- </div>
+ <hbp-connectivity-matrix-row
+ #connectivityComponent
+ *ngIf="regionName && !fetching"
+ [region]="regionName + (regionHemisphere? ' - ' + regionHemisphere : '')"
+ [connections]="connectionsString"
+ show-export="true" hide-export-view="true"
+ theme="dark">
</hbp-connectivity-matrix-row>
<full-connectivity-grid #fullConnectivityGrid
[matrix]="matrixString"
@@ -83,4 +77,9 @@
[datasetDescription]="selectedDataset?.description || selectedDataset?.data?.description"
only-export="true">
</full-connectivity-grid>
+
+ <mat-menu #exportMenu="matMenu">
+ <button mat-menu-item (click)="exportConnectivityProfile()">Regional</button>
+ <button mat-menu-item (click)="exportFullConnectivity()">Dataset</button>
+ </mat-menu>
</div>
diff --git a/src/index.html b/src/index.html
index 4f4d9361987d2956fe3c90301196dd0370b608bc..bc2785b8c855b286c5e53b6a385243899b504e41 100644
--- a/src/index.html
+++ b/src/index.html
@@ -15,7 +15,7 @@
<script src="https://unpkg.com/kg-dataset-previewer@1.2.0/dist/kg-dataset-previewer/kg-dataset-previewer.js" defer></script>
<script src="https://unpkg.com/three-surfer@0.0.11/dist/bundle.js" defer></script>
<script type="module" src="https://unpkg.com/ng-layer-tune@0.0.5/dist/ng-layer-tune/ng-layer-tune.esm.js"></script>
- <script type="module" src="https://unpkg.com/hbp-connectivity-component@0.6.1/dist/connectivity-component/connectivity-component.js" ></script>
+ <script type="module" src="https://unpkg.com/hbp-connectivity-component@0.6.2/dist/connectivity-component/connectivity-component.js" ></script>
<title>Interactive Atlas Viewer</title>
</head>