@datagrok/peptides 1.9.3 → 1.12.0

package/src/tests/viewers.ts

@@ -1,13 +1,14 @@
+import * as grok from 'datagrok-api/grok';
 import * as DG from 'datagrok-api/dg';
 
-import {before, category, expect, test, testViewer} from '@datagrok-libraries/utils/src/test';
+import {awaitCheck, before, category, expect, test, testViewer} from '@datagrok-libraries/utils/src/test';
 import {aligned1} from './test-data';
 import {PeptidesModel, VIEWER_TYPE} from '../model';
 import {_package} from '../package-test';
 import {NOTATION} from '@datagrok-libraries/bio/src/utils/macromolecule';
 import {scaleActivity} from '../utils/misc';
 import {startAnalysis} from '../widgets/peptides';
-import {MONOMER_POSITION_MODE, MonomerPosition, MostPotentResiduesViewer, showTooltip} from '../viewers/sar-viewer';
+import {MONOMER_POSITION_MODE, MonomerPosition, MostPotentResidues, showTooltip} from '../viewers/sar-viewer';
 import {SCALING_METHODS} from '../utils/constants';
 import {LST_PROPERTIES, LogoSummaryTable} from '../viewers/logo-summary';
 import {PositionHeight} from '@datagrok-libraries/bio/src/viewers/web-logo';
@@ -45,7 +46,18 @@ category('Viewers: Monomer-Position', () => {
     if (tempModel === null)
       throw new Error('Model is null');
     model = tempModel;
+    let overlayInit = false;
+    model._analysisView!.grid.onAfterDrawOverlay.subscribe(() => overlayInit = true);
+
     mpViewer = model.findViewer(VIEWER_TYPE.MONOMER_POSITION) as MonomerPosition;
+
+    // Ensure grid finished initializing to prevent Unhandled exceptions
+    let accrodionInit = false;
+    grok.events.onAccordionConstructed.subscribe((_) => accrodionInit = true);
+    await awaitCheck(() => model!.df.currentRowIdx === 0, 'Grid cell never finished initializing', 2000);
+    await awaitCheck(() => grok.shell.o instanceof DG.Column, 'Shell object never changed', 2000);
+    await awaitCheck(() => accrodionInit, 'Accordion never finished initializing', 2000);
+    await awaitCheck(() => overlayInit, 'Overlay never finished initializing', 2000);
   });
 
   test('Tooltip', async () => {
@@ -70,7 +82,7 @@ category('Viewers: Monomer-Position', () => {
     expect(mpViewer.mode, MONOMER_POSITION_MODE.MUTATION_CLIFFS,
       `Monomer-Position mode is not ${MONOMER_POSITION_MODE.MUTATION_CLIFFS} after switching`);
   });
-});
+}, {clear: false});
 
 category('Viewers: Most Potent Residues', () => {
   let df: DG.DataFrame;
@@ -79,7 +91,7 @@ category('Viewers: Most Potent Residues', () => {
   let sequenceCol: DG.Column<string>;
   let clusterCol: DG.Column<any>;
   let scaledActivityCol: DG.Column<number>;
-  let mprViewer: MostPotentResiduesViewer;
+  let mprViewer: MostPotentResidues;
 
   before(async () => {
     df = DG.DataFrame.fromCsv(await _package.files.readAsText('tests/HELM_small.csv'));
@@ -94,7 +106,18 @@ category('Viewers: Most Potent Residues', () => {
     if (tempModel === null)
       throw new Error('Model is null');
     model = tempModel;
-    mprViewer = model.findViewer(VIEWER_TYPE.MOST_POTENT_RESIDUES) as MostPotentResiduesViewer;
+    let overlayInit = false;
+    model._analysisView!.grid.onAfterDrawOverlay.subscribe(() => overlayInit = true);
+
+    mprViewer = model.findViewer(VIEWER_TYPE.MOST_POTENT_RESIDUES) as MostPotentResidues;
+
+    // Ensure grid finished initializing to prevent Unhandled exceptions
+    let accrodionInit = false;
+    grok.events.onAccordionConstructed.subscribe((_) => accrodionInit = true);
+    await awaitCheck(() => model!.df.currentRowIdx === 0, 'Grid cell never finished initializing', 2000);
+    await awaitCheck(() => grok.shell.o instanceof DG.Column, 'Shell object never changed', 2000);
+    await awaitCheck(() => accrodionInit, 'Accordion never finished initializing', 2000);
+    await awaitCheck(() => overlayInit, 'Overlay never finished initializing', 2000);
   });
 
   test('Tooltip', async () => {
@@ -127,7 +150,18 @@ category('Viewers: Logo Summary Table', () => {
     if (tempModel === null)
       throw new Error('Model is null');
     model = tempModel;
+    let overlayInit = false;
+    model._analysisView!.grid.onAfterDrawOverlay.subscribe(() => overlayInit = true);
+
     lstViewer = model.findViewer(VIEWER_TYPE.LOGO_SUMMARY_TABLE) as LogoSummaryTable;
+
+    // Ensure grid finished initializing to prevent Unhandled exceptions
+    let accrodionInit = false;
+    grok.events.onAccordionConstructed.subscribe((_) => accrodionInit = true);
+    await awaitCheck(() => model!.df.currentRowIdx === 0, 'Grid cell never finished initializing', 2000);
+    await awaitCheck(() => grok.shell.o instanceof DG.Column, 'Shell object never changed', 2000);
+    await awaitCheck(() => accrodionInit, 'Accordion never finished initializing', 2000);
+    await awaitCheck(() => overlayInit, 'Overlay never finished initializing', 2000);
   });
 
   test('Properties', async () => {
@@ -152,4 +186,4 @@ category('Viewers: Logo Summary Table', () => {
     const tooltipElement = lstViewer.showTooltip(cluster, 0, 0);
     expect(tooltipElement !== null, true, `Tooltip is not shown for cluster '${cluster}'`);
   });
-});
+}, {clear: false});

package/src/tests/widgets.ts

@@ -1,7 +1,7 @@
 import * as grok from 'datagrok-api/grok';
 import * as DG from 'datagrok-api/dg';
 
-import {category, test, before, expect, delay} from '@datagrok-libraries/utils/src/test';
+import {category, test, before, expect, awaitCheck} from '@datagrok-libraries/utils/src/test';
 import {_package} from '../package-test';
 import {PeptidesModel, VIEWER_TYPE} from '../model';
 import {scaleActivity} from '../utils/misc';
@@ -36,6 +36,16 @@ category('Widgets: Settings', () => {
     if (tempModel === null)
       throw new Error('Model is null');
     model = tempModel;
+    let overlayInit = false;
+    model._analysisView!.grid.onAfterDrawOverlay.subscribe(() => overlayInit = true);
+
+    // Ensure grid finished initializing to prevent Unhandled exceptions
+    let accrodionInit = false;
+    grok.events.onAccordionConstructed.subscribe((_) => accrodionInit = true);
+    await awaitCheck(() => model!.df.currentRowIdx === 0, 'Grid cell never finished initializing', 2000);
+    await awaitCheck(() => grok.shell.o instanceof DG.Column, 'Shell object never changed', 2000);
+    await awaitCheck(() => accrodionInit, 'Accordion never finished initializing', 2000);
+    await awaitCheck(() => overlayInit, 'Overlay never finished initializing', 2000);
   });
 
   test('UI', async () => {
@@ -77,15 +87,21 @@ category('Widgets: Distribution panel', () => {
     if (tempModel === null)
       throw new Error('Model is null');
     model = tempModel;
+    let overlayInit = false;
+    model._analysisView!.grid.onAfterDrawOverlay.subscribe(() => overlayInit = true);
+
+    // Ensure grid finished initializing to prevent Unhandled exceptions
+    let accrodionInit = false;
+    grok.events.onAccordionConstructed.subscribe((_) => accrodionInit = true);
+    await awaitCheck(() => model!.df.currentRowIdx === 0, 'Grid cell never finished initializing', 2000);
+    await awaitCheck(() => grok.shell.o instanceof DG.Column, 'Shell object never changed', 2000);
+    await awaitCheck(() => accrodionInit, 'Accordion never finished initializing', 2000);
+    await awaitCheck(() => overlayInit, 'Overlay never finished initializing', 2000);
   });
 
   test('UI', async () => {
     getDistributionWidget(model.df, model);
   });
-
-  test('Split', async () => {
-
-  }, {skipReason: 'Not implemented yet'});
 });
 
 category('Widgets: Mutation cliffs', () => {
@@ -109,19 +125,21 @@ category('Widgets: Mutation cliffs', () => {
     if (tempModel === null)
       throw new Error('Model is null');
     model = tempModel;
+    let overlayInit = false;
+    model._analysisView!.grid.onAfterDrawOverlay.subscribe(() => overlayInit = true);
+
+    // Ensure grid finished initializing to prevent Unhandled exceptions
+    let accrodionInit = false;
+    grok.events.onAccordionConstructed.subscribe((_) => accrodionInit = true);
+    await awaitCheck(() => model!.df.currentRowIdx === 0, 'Grid cell never finished initializing', 2000);
+    await awaitCheck(() => grok.shell.o instanceof DG.Column, 'Shell object never changed', 2000);
+    await awaitCheck(() => accrodionInit, 'Accordion never finished initializing', 2000);
+    await awaitCheck(() => overlayInit, 'Overlay never finished initializing', 2000);
   });
 
   test('UI', async () => {
     mutationCliffsWidget(model.df, model);
   });
-
-  test('General', async () => {
-
-  }, {skipReason: 'Not implemented yet'});
-
-  test('Filtering', async () => {
-
-  }, {skipReason: 'Not implemented yet'});
 });
 
 category('Widgets: Actions', () => {
@@ -145,6 +163,16 @@ category('Widgets: Actions', () => {
     if (tempModel === null)
       throw new Error('Model is null');
     model = tempModel;
+    let overlayInit = false;
+    model._analysisView!.grid.onAfterDrawOverlay.subscribe(() => overlayInit = true);
+
+    // Ensure grid finished initializing to prevent Unhandled exceptions
+    let accrodionInit = false;
+    grok.events.onAccordionConstructed.subscribe((_) => accrodionInit = true);
+    await awaitCheck(() => model!.df.currentRowIdx === 0, 'Grid cell never finished initializing', 2000);
+    await awaitCheck(() => grok.shell.o instanceof DG.Column, 'Shell object never changed', 2000);
+    await awaitCheck(() => accrodionInit, 'Accordion never finished initializing', 2000);
+    await awaitCheck(() => overlayInit, 'Overlay never finished initializing', 2000);
   });
 
   test('New view', async () => {
@@ -164,7 +192,7 @@ category('Widgets: Actions', () => {
     expect(currentTable.getTag(C.TAGS.UUID), newViewId, 'Current table is expected to have the same UUID as new view');
     expect(currentTable.rowCount, 1, 'Current table is expected to have 1 row');
 
-    await delay(500);
+    await awaitCheck(() => currentTable.currentRowIdx === 0, 'Grid never finished initializing', 2000);
 
     const currentTableModel = currentTable.temp[PeptidesModel.modelName] as PeptidesModel;
     const lstViewer = currentTableModel.findViewer(VIEWER_TYPE.LOGO_SUMMARY_TABLE);
@@ -181,13 +209,15 @@ category('Widgets: Actions', () => {
     const selection = model.df.selection;
     selection.set(0, true, false);
 
-    const lstViewer = model.findViewer(VIEWER_TYPE.LOGO_SUMMARY_TABLE) as LogoSummaryTable;
+    const lstViewer = model.findViewer(VIEWER_TYPE.LOGO_SUMMARY_TABLE) as LogoSummaryTable | null;
+    if (lstViewer === null)
+      throw new Error('Logo summary table viewer is not found');
 
     // Check that custom clusters are not created yet
     expect(wu(model.customClusters).toArray().length, 0, 'Expected to have 0 custom clusters before creating one');
 
     // Create custom cluster
-    model._newClusterSubject.next();
+    lstViewer.clusterFromSelection();
     const customClusterList = wu(model.customClusters).toArray();
     expect(customClusterList.length, 1, 'Expected to have 1 custom cluster');
     const clustName = customClusterList[0].name;
@@ -198,11 +228,11 @@ category('Widgets: Actions', () => {
 
     // Remove custom cluster
     model.modifyClusterSelection(clustName);
-    model._removeClusterSubject.next();
+    lstViewer.removeCluster();
     expect(wu(model.customClusters).toArray().length, 0, 'Expected to have 0 custom clusters after removing one');
     expect(model.df.col(clustName) === null, true,
       'Expected to have no custom cluster column in the table');
     expect(lstViewer.viewerGrid.table.getCol(C.LST_COLUMN_NAMES.CLUSTER).categories.indexOf(clustName) === -1, true,
       'Expected to have no custom cluster in the Logo Summary Table');
   });
-});
+}, {clear: false});

package/src/utils/cell-renderer.ts

@@ -6,7 +6,7 @@ import {PositionStats, MonomerPositionStats} from '../model';
 import {SeqPalette} from '@datagrok-libraries/bio/src/seq-palettes';
 import {monomerToShort} from '@datagrok-libraries/bio/src/utils/macromolecule';
 
-function renderCellSelection(canvasContext: CanvasRenderingContext2D, bound: DG.Rect): void {
+export function renderCellSelection(canvasContext: CanvasRenderingContext2D, bound: DG.Rect): void {
   canvasContext.strokeStyle = '#000';
   canvasContext.lineWidth = 1;
   canvasContext.strokeRect(bound.x + 1, bound.y + 1, bound.width - 1, bound.height - 1);
@@ -22,7 +22,7 @@ export function setAARRenderer(col: DG.Column, alphabet: string): void {
 export function renderMutationCliffCell(canvasContext: CanvasRenderingContext2D, currentAAR: string,
   currentPosition: string, monomerPositionStats: MonomerPositionStats, bound: DG.Rect,
   mutationCliffsSelection: types.PositionToAARList, substitutionsInfo: types.MutationCliffs | null = null,
-  twoColorMode: boolean = false): void {
+  twoColorMode: boolean = false, renderNums: boolean = true): void {
   const positionStats = monomerPositionStats[currentPosition];
   const pVal: number = positionStats[currentAAR].pValue;
   const currentMeanDiff = positionStats[currentAAR].meanDifference;
@@ -56,19 +56,27 @@ export function renderMutationCliffCell(canvasContext: CanvasRenderingContext2D,
   canvasContext.fillStyle = coef;
   canvasContext.arc(midX, midY, radius < 3 ? 3 : radius, 0, Math.PI * 2, true);
   canvasContext.closePath();
-
   canvasContext.fill();
-  if (substitutionsInfo !== null && substitutionsInfo.size > 0) {
-    canvasContext.textBaseline = 'middle';
-    canvasContext.textAlign = 'center';
-    canvasContext.fillStyle = DG.Color.toHtml(DG.Color.black);
-    canvasContext.font = '13px Roboto, Roboto Local, sans-serif';
-    canvasContext.shadowBlur = 5;
-    canvasContext.shadowColor = DG.Color.toHtml(DG.Color.white);
-    let substValue = 0;
-    substitutionsInfo.get(currentAAR)?.get(currentPosition)?.forEach((idxs) => substValue += idxs.length);
-    if (substValue && substValue !== 0)
-      canvasContext.fillText(substValue.toString(), midX, midY);
+
+  if (renderNums) {
+    const substitutions = substitutionsInfo?.get(currentAAR)?.get(currentPosition)?.entries() ?? null;
+    if (substitutions !== null) {
+      canvasContext.textBaseline = 'middle';
+      canvasContext.textAlign = 'center';
+      canvasContext.fillStyle = DG.Color.toHtml(DG.Color.black);
+      canvasContext.font = '13px Roboto, Roboto Local, sans-serif';
+      canvasContext.shadowBlur = 5;
+      canvasContext.shadowColor = DG.Color.toHtml(DG.Color.white);
+      const uniqueValues = new Set<number>();
+
+      for (const [key, value] of substitutions) {
+        uniqueValues.add(key);
+        for (const val of value)
+          uniqueValues.add(val);
+      }
+      if (uniqueValues.size !== 0)
+        canvasContext.fillText(uniqueValues.size.toString(), midX, midY);
+    }
   }
 
   const aarSelection = mutationCliffsSelection[currentPosition];
@@ -105,18 +113,20 @@ export function renderLogoSummaryCell(canvasContext: CanvasRenderingContext2D, c
 }
 
 
-export function drawLogoInBounds(ctx: CanvasRenderingContext2D, bounds: DG.Rect, stats: PositionStats,
+export function drawLogoInBounds(ctx: CanvasRenderingContext2D, bounds: DG.Rect, stats: PositionStats, position: string,
   sortedOrder: string[], rowCount: number, cp: SeqPalette, monomerSelectionStats: { [monomer: string]: number } = {},
   drawOptions: types.DrawOptions = {}): { [monomer: string]: DG.Rect } {
-  drawOptions.fontStyle ??= '16px Roboto, Roboto Local, sans-serif';
+  const pr = window.devicePixelRatio;
+  drawOptions.symbolStyle ??= '16px Roboto, Roboto Local, sans-serif';
   drawOptions.upperLetterHeight ??= 12.2;
   drawOptions.upperLetterAscent ??= 0.25;
   drawOptions.marginVertical ??= 5;
   drawOptions.marginHorizontal ??= 5;
+  drawOptions.textHeight ??= 13;
+  drawOptions.headerStyle ??= `bold ${drawOptions.textHeight * pr}px Roboto, Roboto Local, sans-serif`;
 
-  const pr = window.devicePixelRatio;
-  const totalSpaceBetweenLetters = (sortedOrder.length - 1) * drawOptions.upperLetterAscent;
-  const barHeight = (bounds.height - 2 * drawOptions.marginVertical - totalSpaceBetweenLetters) * pr;
+  const totalSpace = (sortedOrder.length - 1) * drawOptions.upperLetterAscent; // Total space between letters
+  const barHeight = (bounds.height - 2 * drawOptions.marginVertical - totalSpace - 1.25 * drawOptions.textHeight) * pr;
   const leftShift = drawOptions.marginHorizontal * 2;
   const barWidth = (bounds.width - leftShift * 2) * pr;
   const xStart = (bounds.x + leftShift) * pr;
@@ -143,7 +153,7 @@ export function drawLogoInBounds(ctx: CanvasRenderingContext2D, bounds: DG.Rect,
       ctx.fillStyle = cp.get(monomer) ?? cp.get('other');
       ctx.textAlign = 'left';
       ctx.textBaseline = 'top';
-      ctx.font = drawOptions.fontStyle;
+      ctx.font = drawOptions.symbolStyle;
       // Hacks to scale uppercase characters to target rectangle
       const widthTransform = barWidth / mTm.width;
       const heightTransfrom = monomerHeight / drawOptions.upperLetterHeight;
@@ -153,5 +163,13 @@ export function drawLogoInBounds(ctx: CanvasRenderingContext2D, bounds: DG.Rect,
     currentY += monomerHeight + drawOptions.upperLetterAscent * pr;
   }
 
+  // Drawing column header
+  ctx.resetTransform();
+  ctx.fillStyle = DG.Color.toHtml(DG.Color.black);
+  ctx.textAlign = 'center';
+  ctx.textBaseline = 'top';
+  ctx.font = drawOptions.headerStyle;
+  ctx.fillText(position, (bounds.x + bounds.width / 2) * pr, (bounds.y + bounds.height - drawOptions.textHeight) * pr);
+
   return monomerBounds;
 }

package/src/utils/constants.ts

@@ -31,6 +31,7 @@ export enum TAGS {
   SELECTION = 'selection',
   ALPHABET = 'alphabet',
   FILTER = 'filter',
+  INVARIANT_MAP_SELECTION = 'invariantMapSelection',
   SAR_MODE = 'sarMode',
   CLUSTER_SELECTION = 'clusterSelection',
   VISIBLE = 'visible',
@@ -39,6 +40,8 @@ export enum TAGS {
   UUID = 'pep-uuid',
   MONOMER_POSITION_MODE = 'monomerPositionMode',
   MULTIPLE_VIEWS = 'isMultipleViews',
+  IDENTITY_TEMPLATE = 'Identity template',
+  SIMILARITY_TEMPLATE = 'Similarity template',
 }
 
 export enum SEM_TYPES {

package/src/utils/misc.ts

@@ -1,8 +1,11 @@
-import {StringDictionary} from '@datagrok-libraries/utils/src/type-declarations';
+import * as grok from 'datagrok-api/grok';
 import * as ui from 'datagrok-api/ui';
 import * as DG from 'datagrok-api/dg';
 import * as C from './constants';
 import * as type from './types';
+import {StringDictionary} from '@datagrok-libraries/utils/src/type-declarations';
+import {getSplitter} from '@datagrok-libraries/bio/src/utils/macromolecule/utils';
+import {TAGS as bioTags} from '@datagrok-libraries/bio/src/utils/macromolecule';
 
 export function getTypedArrayConstructor(
   maxNum: number): Uint8ArrayConstructor | Uint16ArrayConstructor | Uint32ArrayConstructor {
@@ -59,11 +62,6 @@ export function calculateSelected(df: DG.DataFrame): type.MonomerSelectionStats
   return selectedObj;
 }
 
-// export function isGridCellInvalid(gc: DG.GridCell | null): boolean {
-//   return !gc || !gc.cell.value || !gc.tableColumn || gc.tableRowIndex === null || gc.tableRowIndex === -1 ||
-//     gc.cell.value === DG.INT_NULL || gc.cell.value === DG.FLOAT_NULL;
-// }
-
 export function extractColInfo(col: DG.Column<string>): type.RawColumn {
   return {
     name: col.name,
@@ -73,10 +71,33 @@ export function extractColInfo(col: DG.Column<string>): type.RawColumn {
 }
 
 export function getStatsSummary(legend: HTMLDivElement, hist: DG.Viewer<DG.IHistogramLookSettings>,
-  statsMap: StringDictionary, isTooltip: boolean = false): HTMLDivElement {
+  statsMap: StringDictionary): HTMLDivElement {
   const result = ui.divV([legend, hist.root, ui.tableFromMap(statsMap)]);
-  result.style.minWidth = '200px';
-  if (isTooltip)
-    hist.root.style.maxHeight = '150px';
+  hist.root.style.maxHeight = '75px';
   return result;
 }
+
+export function prepareTableForHistogram(table: DG.DataFrame): DG.DataFrame {
+  const activityCol: DG.Column<number> = table.getCol(C.COLUMNS_NAMES.ACTIVITY_SCALED);
+  const splitCol: DG.Column<boolean> = table.getCol(C.COLUMNS_NAMES.SPLIT_COL);
+
+  const rowCount = activityCol.length;
+  const activityColData = activityCol.getRawData();
+  const expandedData: number[] = new Array(rowCount + splitCol.stats.sum);
+  const expandedMasks: boolean[] = new Array(expandedData.length);
+  for (let i = 0, j = 0; i < rowCount; ++i) {
+    const isSplit = splitCol.get(i)!;
+    expandedData[i] = activityColData[i];
+    expandedMasks[i] = isSplit;
+    if (isSplit) {
+      expandedData[rowCount + j] = activityColData[i];
+      expandedMasks[rowCount + j] = false;
+      ++j;
+    }
+  }
+
+  return DG.DataFrame.fromColumns([
+    DG.Column.fromList(DG.TYPE.FLOAT, activityCol.name, expandedData),
+    DG.Column.fromList(DG.TYPE.BOOL, C.COLUMNS_NAMES.SPLIT_COL, expandedMasks),
+  ]);
+}

package/src/utils/peptide-similarity-space.ts

@@ -4,12 +4,11 @@ import * as DG from 'datagrok-api/dg';
 
 import {getSequenceMolecularWeight} from './molecular-measure';
 import {AlignedSequenceEncoder} from '@datagrok-libraries/bio/src/sequence-encoder';
-import {DimensionalityReducer} from '@datagrok-libraries/ml/src/reduce-dimensionality';
+import {DimensionalityReducer, IReduceDimensionalityResult} from '@datagrok-libraries/ml/src/reduce-dimensionality';
 import {
   createDimensinalityReducingWorker,
-  IReduceDimensionalityResult,
 } from '@datagrok-libraries/ml/src/workers/dimensionality-reducing-worker-creator';
-import {Measure, StringMetrics} from '@datagrok-libraries/ml/src/typed-metrics';
+import {DistanceMetricsSubjects, Measure, StringMetrics} from '@datagrok-libraries/ml/src/typed-metrics';
 import {Coordinates} from '@datagrok-libraries/utils/src/type-declarations';
 
 /**
@@ -115,7 +114,7 @@ export class PeptideSimilaritySpaceWidget {
    */
   constructor(alignedSequencesColumn: DG.Column, view: DG.TableView) {
     this.availableMethods = DimensionalityReducer.availableMethods;
-    this.availableMetrics = Measure.getMetricByDataType('String');
+    this.availableMetrics = Measure.getMetricByDataType(DistanceMetricsSubjects.String);
     this.method = this.availableMethods[0];
     this.metrics = this.availableMetrics[0];
     const df = alignedSequencesColumn.dataFrame;

package/src/utils/statistics.ts

@@ -16,7 +16,7 @@ export function getStats(data: RawData | number[], bitArray: BitArray): Stats {
 
   let selectedIndex = 0;
   let restIndex = 0;
-  for (let i = 0; i < data.length; ++i) {
+  for (let i = 0; i < bitArray.length; ++i) {
     if (bitArray.getBit(i))
       selected[selectedIndex++] = data[i];
     else
@@ -29,7 +29,7 @@ export function getStats(data: RawData | number[], bitArray: BitArray): Stats {
     count: selected.length,
     pValue: testResult[currentMeanDiff >= 0 ? 'p-value more' : 'p-value less'] || 0,
     meanDifference: currentMeanDiff || 0,
-    ratio: selected.length / data.length,
+    ratio: selected.length / (bitArray.length),
   };
 }
 

package/src/utils/types.ts

@@ -28,7 +28,7 @@ export type PeptidesSettings = {
 };
 
 export type DrawOptions = {
-  fontStyle?: string,
+  symbolStyle?: string,
   upperLetterHeight?: number,
   upperLetterAscent?: number,
   bounds?: DG.Rect,
@@ -36,6 +36,8 @@ export type DrawOptions = {
   textBaseline?: CanvasTextBaseline,
   marginVertical?: number,
   marginHorizontal?: number,
+  headerStyle?: string,
+  textHeight?: number,
 };
 
 export type StatsInfo = {