Disaggregation Application
  1. Components
  2. PlotsComponent

File

components/plots/plots.component.ts

Description

Static hazard plots.

Metadata

selector app-plots
imports NshmpLibNgPlotsContainerComponent NshmpLibNgPlotComponent NshmpLibNgHazardDesignCodeWarningComponent NshmpLibNgAppMetadataComponent MatAccordion MatExpansionPanel MatExpansionPanelHeader MatExpansionPanelTitle MatDivider ParameterSummaryComponent
templateUrl ./plots.component.html
styleUrl ./plots.component.scss

Index

Properties

Constructor

constructor(service: AppService)
Defined in components/plots/plots.component.ts:45
Parameters :
Name Type Optional
service AppService No

Properties

hazardPlotData
Default value : this.service.hazardPlotData
Defined in components/plots/plots.component.ts:41

Hazard plot data
repositories
Default value : computed(() => this.service.usage()?.metadata.repositories)
Defined in components/plots/plots.component.ts:45

Repo metadata
responseSpectrumPlotData
Default value : this.service.spectrumPlotData
Defined in components/plots/plots.component.ts:43

Spectra plot data

 
import {Component, computed} from '@angular/core';
import {MatDivider} from '@angular/material/divider';
import {
  MatAccordion,
  MatExpansionPanel,
  MatExpansionPanelHeader,
  MatExpansionPanelTitle,
} from '@angular/material/expansion';
import {NshmpLibNgHazardDesignCodeWarningComponent} from '@ghsc/nshmp-lib-ng/hazard';
import {NshmpLibNgAppMetadataComponent} from '@ghsc/nshmp-lib-ng/nshmp';
import {
  NshmpLibNgPlotComponent,
  NshmpLibNgPlotsContainerComponent,
} from '@ghsc/nshmp-lib-ng/plot';

import {AppService} from '../../services/app.service';
import {ParameterSummaryComponent} from '../parameter-summary/parameter-summary.component';

/**
 * Static hazard plots.
 */
@Component({
  imports: [
    NshmpLibNgPlotsContainerComponent,
    NshmpLibNgPlotComponent,
    NshmpLibNgHazardDesignCodeWarningComponent,
    NshmpLibNgAppMetadataComponent,
    MatAccordion,
    MatExpansionPanel,
    MatExpansionPanelHeader,
    MatExpansionPanelTitle,
    MatDivider,
    ParameterSummaryComponent,
  ],
  selector: 'app-plots',
  styleUrl: './plots.component.scss',
  templateUrl: './plots.component.html',
})
export class PlotsComponent {
  /** Hazard plot data */
  hazardPlotData = this.service.hazardPlotData;
  /** Spectra plot data */
  responseSpectrumPlotData = this.service.spectrumPlotData;
  /** Repo metadata */
  repositories = computed(() => this.service.usage()?.metadata.repositories);

  constructor(private service: AppService) {}
}

<nshmp-lib-ng-plots-container>
  <nshmp-lib-ng-hazard-design-code-warning />

  <mat-accordion multi>
    <!-- Hazard plot -->
    <mat-expansion-panel expanded>
      <mat-expansion-panel-header>
        <mat-panel-title>Hazard</mat-panel-title>
      </mat-expansion-panel-header>

      <mat-divider />

      @if (hazardPlotData()) {
        <nshmp-lib-ng-plot class="hazard-plot" [plot]="hazardPlotData()" />
      }
    </mat-expansion-panel>

    <!-- Spectra plot -->
    <mat-expansion-panel expanded>
      <mat-expansion-panel-header>
        <mat-panel-title>Spectra</mat-panel-title>
      </mat-expansion-panel-header>

      <mat-divider />

      @if (responseSpectrumPlotData()) {
        <nshmp-lib-ng-plot
          class="spectra-plot"
          [plot]="responseSpectrumPlotData()"
        />
      }
    </mat-expansion-panel>

    <!-- Parameter summary -->
    <mat-expansion-panel expanded>
      <mat-expansion-panel-header>
        <mat-panel-title>Parameter Summary</mat-panel-title>
      </mat-expansion-panel-header>

      <mat-divider />
      <app-parameter-summary />
    </mat-expansion-panel>

    <!-- App metadata -->
    <mat-expansion-panel expanded>
      <mat-expansion-panel-header>
        <mat-panel-title>Application Metadata</mat-panel-title>
      </mat-expansion-panel-header>

      <mat-divider />
      <nshmp-lib-ng-app-metadata [repositories]="repositories()" />
    </mat-expansion-panel>
  </mat-accordion>
</nshmp-lib-ng-plots-container>
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""