@datagrok/bio 1.8.2 → 1.10.2

package/package.json

@@ -5,7 +5,7 @@
     "name": "Leonid Stolbov",
     "email": "lstolbov@datagrok.ai"
   },
-  "version": "1.8.2",
+  "version": "1.10.2",
   "description": "Bio is a [package](https://datagrok.ai/help/develop/develop#packages) for the [Datagrok](https://datagrok.ai) platform",
   "repository": {
     "type": "git",
@@ -14,16 +14,17 @@
   },
   "dependencies": {
     "@biowasm/aioli": ">=2.4.0",
-    "@datagrok-libraries/bio": "^3.1.0",
-    "@datagrok-libraries/ml": "^3.1.0",
+    "@datagrok-libraries/bio": "^4.1.0",
+    "@datagrok-libraries/chem-meta": "1.0.0",
+    "@datagrok-libraries/ml": "^4.0.0",
     "@datagrok-libraries/utils": "^1.6.2",
     "cash-dom": "latest",
     "datagrok-api": "^1.5.5",
     "dayjs": "^1.11.4",
     "openchemlib": "6.0.1",
     "rxjs": "^6.5.5",
-    "ts-loader": "^9.2.5",
-    "typescript": "^4.4.2"
+    "typescript": "^4.4.2",
+    "wu": "latest"
   },
   "devDependencies": {
     "@types/jest": "^27.0.0",
@@ -35,6 +36,7 @@
     "jest-html-reporter": "^3.6.0",
     "puppeteer": "^13.7.0",
     "ts-jest": "^27.0.0",
+    "ts-loader": "^9.2.5",
     "webpack": "latest",
     "webpack-cli": "^4.10.0",
     "@types/js-yaml": "^4.0.5",

package/src/package.ts

@@ -15,7 +15,7 @@ import {Aminoacids} from '@datagrok-libraries/bio/src/aminoacids';
 import {getEmbeddingColsNames, sequenceSpace} from './utils/sequence-space';
 import {AvailableMetrics} from '@datagrok-libraries/ml/src/typed-metrics';
 import {getActivityCliffs} from '@datagrok-libraries/ml/src/viewers/activity-cliffs';
-import {sequenceGetSimilarities, drawTooltip} from './utils/sequence-activity-cliffs';
+import {drawSequences, sequenceGetSimilarities} from './utils/sequence-activity-cliffs';
 import {createJsonMonomerLibFromSdf, encodeMonomers, getMolfilesFromSeq, HELM_CORE_LIB_FILENAME} from './utils/utils';
 import {getMacroMol} from './utils/atomic-works';
 import {MacromoleculeSequenceCellRenderer} from './utils/cell-renderer';
@@ -23,13 +23,28 @@ import {convert} from './utils/convert';
 import {representationsWidget} from './widgets/representations';
 import {UnitsHandler} from '@datagrok-libraries/bio/src/utils/units-handler';
 import {FastaFileHandler} from '@datagrok-libraries/bio/src/utils/fasta-handler';
-import {removeEmptyStringRows} from '@datagrok-libraries/utils/src/dataframe-utils'
-
+import {removeEmptyStringRows} from '@datagrok-libraries/utils/src/dataframe-utils';
+import {
+  generateManySequences,
+  generateLongSequence,
+  performanceTest
+} from './tests/test-sequnces-generators';
 
 //tags: init
 export async function initBio() {
 }
 
+//name: testManySequencesPerformance
+export function testManySequencesPerformance(): void {
+  performanceTest(generateManySequences, 'Many sequences');
+}
+
+//name: testLongSequencesPerformance
+export function testLongSequencesPerformance(): void {
+  performanceTest(generateLongSequence, 'Long sequences');
+}
+
+
 //name: fastaSequenceCellRenderer
 //tags: cellRenderer
 //meta.cellType: Sequence
@@ -51,7 +66,7 @@ export function separatorSequenceCellRenderer(): MacromoleculeSequenceCellRender
 function checkInputColumn(col: DG.Column, name: string,
   allowedNotations: string[] = [], allowedAlphabets: string[] = []): boolean {
   const notation: string = col.getTag(DG.TAGS.UNITS);
-  const alphabet: string = col.getTag('alphabet')
+  const alphabet: string = col.getTag('alphabet');
   if (col.semType !== DG.SEMTYPE.MACROMOLECULE) {
     grok.shell.warning(name + ' analysis is allowed for Macromolecules semantic type');
     return false;
@@ -127,7 +142,7 @@ export async function activityCliffs(df: DG.DataFrame, macroMolecule: DG.Column,
     'aligned': macroMolecule.tags['aligned'],
     'separator': macroMolecule.tags['separator'],
     'alphabet': macroMolecule.tags['alphabet'],
-  }
+  };
   const sp = await getActivityCliffs(
     df,
     macroMolecule,
@@ -142,9 +157,9 @@ export async function activityCliffs(df: DG.DataFrame, macroMolecule: DG.Column,
     tags,
     sequenceSpace,
     sequenceGetSimilarities,
-    drawTooltip,
+    drawSequences,
     (options as any)[methodName]);
-    return sp;
+  return sp;
 }
 
 //top-menu: Bio | Sequence Space...
@@ -155,18 +170,18 @@ export async function activityCliffs(df: DG.DataFrame, macroMolecule: DG.Column,
 //input: string similarityMetric { choices:["Levenshtein", "Tanimoto"] }
 //input: bool plotEmbeddings = true
 export async function sequenceSpaceTopMenu(table: DG.DataFrame, macroMolecule: DG.Column, methodName: string,
-  similarityMetric: string = 'Levenshtein', plotEmbeddings: boolean): Promise<DG.Viewer|undefined> {
+  similarityMetric: string = 'Levenshtein', plotEmbeddings: boolean): Promise<DG.Viewer | undefined> {
   if (!checkInputColumn(macroMolecule, 'Activity Cliffs'))
     return;
   const encodedCol = encodeMonomers(macroMolecule);
   if (!encodedCol)
     return;
   const embedColsNames = getEmbeddingColsNames(table);
-  const withoutEmptyValues = DG.DataFrame.fromColumns([macroMolecule]).clone();
+  const withoutEmptyValues = DG.DataFrame.fromColumns([encodedCol]).clone();
   const emptyValsIdxs = removeEmptyStringRows(withoutEmptyValues, encodedCol);
 
   const chemSpaceParams = {
-    seqCol: withoutEmptyValues.col(macroMolecule.name)!,
+    seqCol: withoutEmptyValues.col(encodedCol.name)!,
     methodName: methodName,
     similarityMetric: similarityMetric,
     embedAxesNames: embedColsNames
@@ -174,11 +189,11 @@ export async function sequenceSpaceTopMenu(table: DG.DataFrame, macroMolecule: D
   const sequenceSpaceRes = await sequenceSpace(chemSpaceParams);
   const embeddings = sequenceSpaceRes.coordinates;
   for (const col of embeddings) {
-      const listValues = col.toList();
-      emptyValsIdxs.forEach((ind: number) => listValues.splice(ind, 0, null));
-      table.columns.add(DG.Column.fromList('double', col.name, listValues));
+    const listValues = col.toList();
+    emptyValsIdxs.forEach((ind: number) => listValues.splice(ind, 0, null));
+    table.columns.add(DG.Column.fromList('double', col.name, listValues));
   }
-  let sp;   
+  let sp;
   if (plotEmbeddings) {
     for (const v of grok.shell.views) {
       if (v.name === table.name)

package/src/tests/WebLogo-positions-test.ts

@@ -12,11 +12,11 @@ category('WebLogo-positions', () => {
   let currentView: DG.View;
 
   const csvDf1 = `seq
-    ATC-G-TTGC--
-    ATC-G-TTGC--
-    -TC-G-TTGC--
-    -TC-GCTTGC--
-    -TC-GCTTGC--`;
+ATC-G-TTGC--
+ATC-G-TTGC--
+-TC-G-TTGC--
+-TC-GCTTGC--
+-TC-GCTTGC--`;
 
 
   before(async () => {
@@ -34,8 +34,10 @@ category('WebLogo-positions', () => {
     const df: DG.DataFrame = DG.DataFrame.fromCsv(csvDf1);
     const tv: DG.TableView = grok.shell.addTableView(df);
 
-    df.getCol('seq').semType = 'Macromolecule';
-    df.getCol('seq').setTag('units', 'fasta:SEQ.MSA:DNA');
+    const seqCol: DG.Column = df.getCol('seq');
+    seqCol.semType = 'Macromolecule';
+    seqCol.setTag('units', 'fasta');
+    seqCol.setTag('alphabet', 'DNA');
 
     const wlViewer: WebLogo = await df.plot.fromType('WebLogo') as unknown as WebLogo;
     tv.dockManager.dock(wlViewer.root, DG.DOCK_TYPE.DOWN);
@@ -81,10 +83,11 @@ category('WebLogo-positions', () => {
     const df: DG.DataFrame = DG.DataFrame.fromCsv(csvDf2);
     const tv: DG.TableView = grok.shell.addTableView(df);
 
-    df.getCol('seq').semType = 'Macromolecule';
-    df.getCol('seq').setTag('units', 'fasta:SEQ.MSA:DNA');
+    const seqCol: DG.Column = df.getCol('seq');
+    seqCol.semType = 'Macromolecule';
+    seqCol.setTag('units', 'fasta');
+    seqCol.setTag('alphabet', 'DNA');
 
-    let seq: Column = df.getCol('seq');
     df.filter.init((i) => {
       return i > 2;
     });
@@ -125,8 +128,10 @@ category('WebLogo-positions', () => {
     const df: DG.DataFrame = DG.DataFrame.fromCsv(csvDf1);
     const tv: DG.TableView = grok.shell.addTableView(df);
 
-    df.getCol('seq').semType = 'Macromolecule';
-    df.getCol('seq').setTag('units', 'fasta:SEQ.MSA:DNA');
+    const seqCol: DG.Column = df.getCol('seq');
+    seqCol.semType = 'Macromolecule';
+    seqCol.setTag('units', 'fasta');
+    seqCol.setTag('alphabet', 'DNA');
 
     const wlViewer: WebLogo = await df.plot.fromType('WebLogo', {'skipEmptyPositions': true}) as unknown as WebLogo;
     tv.dockManager.dock(wlViewer.root, DG.DOCK_TYPE.DOWN);
@@ -156,7 +161,6 @@ category('WebLogo-positions', () => {
         expect(positions[i].freq[key].count, resAllDf1[i].freq[key].count);
       }
     }
-
   });
 
 });

package/src/tests/detectors-test.ts

@@ -5,6 +5,7 @@ import * as ui from 'datagrok-api/ui';
 import * as DG from 'datagrok-api/dg';
 
 import {importFasta} from '../package';
+import {UnitsHandler} from '@datagrok-libraries/bio/src/utils/units-handler';
 
 type DfReaderFunc = () => Promise<DG.DataFrame>;
 
@@ -198,44 +199,44 @@ MWRSWY-CKHP
   test('NegativeSmiles', async () => { await _testNeg(readCsv('csvDfSmiles', csvDfSmiles), 'col1'); });
 
   test('Dna1', async () => {
-    await _testPos(readCsv('csvDfDna1', csvDfDna1), 'seq', 'fasta', 'SEQ', 'DNA');
+    await _testPos(readCsv('csvDfDna1', csvDfDna1), 'seq', 'fasta', 'SEQ', 'DNA', 4, false);
   });
   test('Rna1', async () => {
-    await _testPos(readCsv('csvDfRna1', csvDfRna1), 'seq', 'fasta', 'SEQ', 'RNA');
+    await _testPos(readCsv('csvDfRna1', csvDfRna1), 'seq', 'fasta', 'SEQ', 'RNA', 4, false);
   });
   test('AA1', async () => {
-    await _testPos(readCsv('csvDfPt1', csvDfPt1), 'seq', 'fasta', 'SEQ', 'PT');
+    await _testPos(readCsv('csvDfPt1', csvDfPt1), 'seq', 'fasta', 'SEQ', 'PT', 20, false);
   });
   test('MsaDna1', async () => {
-    await _testPos(readCsv('csvDfMsaDna1', csvDfMsaDna1), 'seq', 'fasta', 'SEQ.MSA', 'DNA');
+    await _testPos(readCsv('csvDfMsaDna1', csvDfMsaDna1), 'seq', 'fasta', 'SEQ.MSA', 'DNA', 4, false);
   });
 
   test('MsaAA1', async () => {
-    await _testPos(readCsv('csvDfMsaPt1', csvDfMsaPt1), 'seq', 'fasta', 'SEQ.MSA', 'PT');
+    await _testPos(readCsv('csvDfMsaPt1', csvDfMsaPt1), 'seq', 'fasta', 'SEQ.MSA', 'PT', 20, false);
   });
 
   test('SepDna', async () => {
-    await _testPos(readCsv('csvDfSepDna', csvDfSepDna), 'seq', 'separator', 'SEQ', 'DNA', '*');
+    await _testPos(readCsv('csvDfSepDna', csvDfSepDna), 'seq', 'separator', 'SEQ', 'DNA', 4, false, '*');
   });
   test('SepRna', async () => {
-    await _testPos(readCsv('csvDfSepRna', csvDfSepRna), 'seq', 'separator', 'SEQ', 'RNA', '*');
+    await _testPos(readCsv('csvDfSepRna', csvDfSepRna), 'seq', 'separator', 'SEQ', 'RNA', 4, false, '*');
   });
   test('SepPt', async () => {
-    await _testPos(readCsv('csvDfSepPt', csvDfSepPt), 'seq', 'separator', 'SEQ', 'PT', '-');
+    await _testPos(readCsv('csvDfSepPt', csvDfSepPt), 'seq', 'separator', 'SEQ', 'PT', 20, false, '-');
   });
   test('SepUn1', async () => {
-    await _testPos(readCsv('csvDfSepUn1', csvDfSepUn1), 'seq', 'separator', 'SEQ', 'UN', '-');
+    await _testPos(readCsv('csvDfSepUn1', csvDfSepUn1), 'seq', 'separator', 'SEQ', 'UN', 8, true, '-');
   });
   test('SepUn2', async () => {
-    await _testPos(readCsv('csvDfSepUn2', csvDfSepUn2), 'seq', 'separator', 'SEQ', 'UN', '/');
+    await _testPos(readCsv('csvDfSepUn2', csvDfSepUn2), 'seq', 'separator', 'SEQ', 'UN', 9, true, '/');
   });
 
   test('SepMsaN1', async () => {
-    await _testPos(readCsv('csvDfSepMsaDna1', csvDfSepMsaDna1), 'seq', 'separator', 'SEQ.MSA', 'DNA', '-');
+    await _testPos(readCsv('csvDfSepMsaDna1', csvDfSepMsaDna1), 'seq', 'separator', 'SEQ.MSA', 'DNA', 4, false, '-');
   });
 
   test('SamplesFastaCsvPt', async () => {
-    await _testPos(readSamples(Samples.fastaCsv), 'sequence', 'fasta', 'SEQ', 'PT');
+    await _testPos(readSamples(Samples.fastaCsv), 'sequence', 'fasta', 'SEQ', 'PT', 20, false);
   });
   test('SamplesFastaCsvNegativeEntry', async () => {
     await _testNeg(readSamples(Samples.fastaCsv), 'Entry');
@@ -248,7 +249,7 @@ MWRSWY-CKHP
   });
 
   test('SamplesFastaFastaPt', async () => {
-    await _testPos(readSamples(Samples.fastaFasta, readFileFasta), 'sequence', 'fasta', 'SEQ', 'PT');
+    await _testPos(readSamples(Samples.fastaFasta, readFileFasta), 'sequence', 'fasta', 'SEQ', 'PT', 20, false);
   });
 
   // peptidesComplex contains monomers with spaces in AlignedSequence columns, which are forbidden
@@ -266,7 +267,7 @@ MWRSWY-CKHP
   });
 
   test('samplesMsaComplexUn', async () => {
-    await _testPos(readSamples(Samples.msaComplex), 'MSA', 'separator', 'SEQ.MSA', 'UN', '/');
+    await _testPos(readSamples(Samples.msaComplex), 'MSA', 'separator', 'SEQ.MSA', 'UN', 161, true, '/');
   });
   test('samplesMsaComplexNegativeActivity', async () => {
     await _testNeg(readSamples(Samples.msaComplex), 'Activity');
@@ -281,7 +282,7 @@ MWRSWY-CKHP
   });
 
   test('samplesHelmCsvHELM', async () => {
-    await _testPos(readSamples(Samples.helmCsv), 'HELM', 'helm', null, null, null);
+    await _testPos(readSamples(Samples.helmCsv), 'HELM', 'helm', null, null, 160, true, null);
   });
 
   test('samplesHelmCsvNegativeActivity', async () => {
@@ -297,7 +298,7 @@ MWRSWY-CKHP
     await _testNeg(readSamples(Samples.testHelmCsv), 'Test type');
   });
   test('samplesTestHelmPositiveHelmString', async () => {
-    await _testPos(readSamples(Samples.testHelmCsv), 'HELM string', 'helm', null, null, null);
+    await _testPos(readSamples(Samples.testHelmCsv), 'HELM string', 'helm', null, null, 9, true, null);
   });
   test('samplesTestHelmNegativeValid', async () => {
     await _testNeg(readSamples(Samples.testHelmCsv), 'Valid?');
@@ -329,7 +330,7 @@ MWRSWY-CKHP
   });
 
   test('samplesFastaPtPosSequence', async () => {
-    await _testPos(readSamples(Samples.fastaPtCsv), 'sequence', 'fasta', 'SEQ', 'PT');
+    await _testPos(readSamples(Samples.fastaPtCsv), 'sequence', 'fasta', 'SEQ', 'PT', 20, false);
   });
 
   test('samplesTestCerealNegativeCerealName', async () => {
@@ -371,7 +372,8 @@ MWRSWY-CKHP
 export async function _testNeg(readDf: DfReaderFunc, colName: string) {
   const df: DG.DataFrame = await readDf();
   const col: DG.Column = df.col(colName)!;
-  const semType: string = await grok.functions.call('Bio:detectMacromolecule', {col: col});
+  const semType: string = await grok.functions
+    .call('Bio:detectMacromolecule', {col: col}) as unknown as string;
   if (semType)
     col.semType = semType;
 
@@ -384,10 +386,15 @@ export async function _testNeg(readDf: DfReaderFunc, colName: string) {
   }
 }
 
-export async function _testPos(readDf: DfReaderFunc, colName: string, units: string, aligned: string | null, alphabet: string | null, separator: string | null = null) {
+export async function _testPos(
+  readDf: DfReaderFunc, colName: string, units: string,
+  aligned: string | null, alphabet: string | null, alphabetSize: number, alphabetIsMultichar: boolean,
+  separator: string | null = null
+) {
   const df: DG.DataFrame = await readDf();
   const col: DG.Column = df.col(colName)!;
-  const semType: string = await grok.functions.call('Bio:detectMacromolecule', {col: col});
+  const semType: string = await grok.functions
+    .call('Bio:detectMacromolecule', {col: col}) as unknown as string;
   if (semType)
     col.semType = semType;
 
@@ -397,5 +404,13 @@ export async function _testPos(readDf: DfReaderFunc, colName: string, units: str
   expect(col.getTag('alphabet'), alphabet);
   if (separator)
     expect(col.getTag('separator'), separator);
+
+  const uh = new UnitsHandler(col);
+  expect(uh.getAlphabetSize(), alphabetSize);
+  expect(uh.getAlphabetIsMultichar(), alphabetIsMultichar);
+  if (!uh.isHelm()) {
+    expect(uh.aligned, aligned);
+    expect(uh.alphabet, alphabet);
+  }
 }
 

package/src/tests/msa-tests.ts

@@ -49,7 +49,8 @@ async function _testMsaIsCorrect(srcCsv: string, tgtCsv: string): Promise<void>
   const tgtDf: DG.DataFrame = DG.DataFrame.fromCsv(tgtCsv);
 
   const srcCol: DG.Column = srcDf.getCol('seq')!;
-  const semType: string = await grok.functions.call('Bio:detectMacromolecule', {col: srcCol});
+  const semType: string = await grok.functions
+    .call('Bio:detectMacromolecule', {col: srcCol}) as unknown as string;
   if (semType)
     srcCol.semType = semType;
 

package/src/tests/test-sequnces-generators.ts

@@ -0,0 +1,45 @@
+import * as DG from 'datagrok-api/dg';
+import * as grok from 'datagrok-api/grok';
+
+export function generateManySequences(): string {
+  let csvData = `MSA,Activity
+meI/hHis/Aca/N/T/dE/Thr_PO3H2/Aca/D-Tyr_Et/Tyr_ab-dehydroMe/dV/E/N/D-Orn/D-aThr//Phe_4Me,5.30751`;
+  for (let i = 0; i < 10 ** 6; i++) {
+    csvData += `\n meI/hHis/Aca/N/T/dE/Thr_PO3H2/Aca/D-Tyr_Et/Tyr_ab-dehydroMe/dV/E/N/D-Orn/D-aThr//Phe_4Me,5.30751`;
+  }
+  return csvData;
+}
+
+export function generateLongSequence(): string {
+  let longSequence = `meI/hHis/Aca/N/T/dE/Thr_PO3H2/Aca/D-Tyr_Et/Tyr_ab-dehydroMe/dV/E/N/D-Orn/D-aThr`;
+  for (let i = 0; i < 10 ** 5; i++) {
+    longSequence += `/Aca/N/T/dE/Thr_PO3H2/Aca/D-Tyr_Et/Tyr_ab-dehydroMe/dV/dv`;
+  }
+  longSequence += `//Phe_4Me,5.30751`;
+  let csvData = `MSA,Activity `;
+  for (let i = 0; i <= 10 ** 1 * 4; i++) {
+    csvData += `\n ${longSequence}`;
+  }
+  return csvData;
+}
+export function setTagsMacromolecule(col: DG.Column) {
+  col.semType = DG.SEMTYPE.MACROMOLECULE;
+  col.setTag('units', 'separator');
+  col.setTag('aligned', 'SEQ.MSA');
+  col.setTag('alphabet', 'UN');
+  col.setTag('separator', '/');
+  return col;
+}
+
+export function performanceTest(generateFunc: () => string,testName: string) {
+  const startTime: number = Date.now();
+  const csv = generateFunc();
+  const df: DG.DataFrame = DG.DataFrame.fromCsv(csv);
+  const col: DG.Column = df.columns.byName('MSA');
+  setTagsMacromolecule(col);
+  grok.shell.addTableView(df);
+
+  const endTime: number = Date.now();
+  const elapsedTime: number = endTime - startTime;
+  console.log(`Performance test: ${testName}: ${elapsedTime}ms`);
+}

package/src/utils/atomic-works.ts

@@ -1,6 +1,8 @@
 import * as OCL from 'openchemlib/full.js';
 import * as grok from 'datagrok-api/grok';
 
+import {RDModule} from '@datagrok-libraries/chem-meta/src/rdkit-api';
+
 export async function getMacroMol(monomers: any[][]): Promise<string[]> {
   let result: string[] = [];
   const moduleRdkit = await grok.functions.call('Chem:getRdKitModule');

package/src/utils/cell-renderer.ts

@@ -6,9 +6,12 @@ import {UnknownSeqPalette, UnknownSeqPalettes} from '@datagrok-libraries/bio/src
 import {SplitterFunc, WebLogo} from '@datagrok-libraries/bio/src/viewers/web-logo';
 import {SeqPalette} from '@datagrok-libraries/bio/src/seq-palettes';
 import * as ui from 'datagrok-api/ui';
+import {printLeftOrCentered, DrawStyle} from '@datagrok-libraries/bio/src/utils/cell-renderer';
 
 const undefinedColor = 'rgb(100,100,100)';
-const grayColor = '#808080';
+const monomerToShortFunction: (amino: string, maxLengthOfMonomer: number) => string = WebLogo.monomerToShort;
+const gapRenderer = 5;
+
 
 function getPalleteByType(paletteType: string): SeqPalette {
   switch (paletteType) {
@@ -44,81 +47,6 @@ export function processSequence(subParts: string[]): [string[], boolean] {
 }
 
 
-/**
- * A function that prints a string aligned to left or centered.
- *
- * @param {number} x x coordinate.
- * @param {number} y y coordinate.
- * @param {number} w Width.
- * @param {number} h Height.
- * @param {CanvasRenderingContext2D} g Canvas rendering context.
- * @param {string} s String to print.
- * @param {string} [color=undefinedColor] String color.
- * @param {number} [pivot=0] Pirvot.
- * @param {boolean} [left=false] Is left aligned.
- * @param {number} [transparencyRate=0.0] Transparency rate where 1.0 is fully transparent
- * @param {string} [separator=''] Is separator for sequence.
- * @param {boolean} [last=false] Is checker if element last or not.
- * @return {number} x coordinate to start printing at.
- */
-export function printLeftOrCentered(
-  x: number, y: number, w: number, h: number,
-  g: CanvasRenderingContext2D, s: string, color = undefinedColor,
-  pivot: number = 0, left = false, transparencyRate: number = 1.0,
-  separator: string = '', last: boolean = false, drawStyle: string = 'classic', maxWord: any = {}, maxWordIdx: number = 0, gridCell: any = {}): number {
-  g.textAlign = 'start';
-  const colorPart = s.substring(0);
-  let grayPart = last ? '' : separator;
-  if (drawStyle === 'msa') {
-    grayPart = '';
-  }
-
-  let textSize: any = g.measureText(colorPart + grayPart);
-  const indent = 5;
-
-  let maxColorTextSize = g.measureText(colorPart).width;
-  let colorTextSize = g.measureText(colorPart).width;
-  const dy = (textSize.fontBoundingBoxAscent + textSize.fontBoundingBoxDescent) / 2;
-  textSize = textSize.width;
-  if (drawStyle === 'msa') {
-    maxColorTextSize = maxWord[maxWordIdx];
-    textSize = maxWord[maxWordIdx];
-    if (maxColorTextSize > maxWord) {
-      maxWord[maxWordIdx] = maxColorTextSize;
-      gridCell.cell.column.temp = maxWord;
-    }
-    if (maxWordIdx > (maxWord['bio-maxIndex'] ?? 0)) {
-      maxWord['bio-maxIndex'] = maxWordIdx;
-      gridCell.cell.column.temp = maxWord;
-    }
-  }
-
-  function draw(dx1: number, dx2: number): void {
-    g.fillStyle = color;
-    g.globalAlpha = transparencyRate;
-    if (drawStyle === 'classic') {
-      g.fillText(colorPart, x + dx1, y + dy);
-      g.fillStyle = grayColor;
-      g.fillText(grayPart, x + dx2, y + dy);
-    }
-    if (drawStyle === 'msa') {
-      g.fillStyle = color;
-      g.fillText(colorPart, x + dx1 + ((maxWord[maxWordIdx] - colorTextSize) / 2), y + dy);
-    }
-  }
-
-  if (left || textSize > w) {
-    draw(indent, indent + maxColorTextSize);
-    return x + maxColorTextSize + g.measureText(grayPart).width;
-
-  } else {
-    const dx = (w - textSize) / 2;
-    draw(dx, dx + maxColorTextSize);
-    return x + dx + maxColorTextSize;
-  }
-}
-
-
 export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
   get name(): string { return 'sequence'; }
 
@@ -133,12 +61,9 @@ export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
       return;
     }
     const maxLengthWordsSum = gridCell.cell.column.temp['bio-sum-maxLengthWords'];
-    if (maxLengthWordsSum == null) {
-      gridCell.cell.column.setTag('.calculatedCellRender', 'unexist');
-    }
     const maxIndex = gridCell.cell.column.temp['bio-maxIndex'];
     //@ts-ignore
-    const argsX = e.layerX - gridCell.gridColumn.left - ((gridCell.bounds.x<0) ? gridCell.bounds.x : 0);
+    const argsX = e.layerX - gridCell.gridColumn.left + (gridCell.gridColumn.left - gridCell.bounds.x);
     let left = 0;
     let right = maxIndex;
     let found = false;
@@ -164,7 +89,7 @@ export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
     const separator = gridCell.cell.column.getTag('separator') ?? '';
     const splitterFunc: SplitterFunc = WebLogo.getSplitter('separator', separator);
     const subParts: string[] = splitterFunc(gridCell.cell.value);
-    ui.tooltip.show(ui.div(subParts[left]), e.x + 16, e.y + 16);
+    (((subParts[left]?.length ?? 0) > 0)) ? ui.tooltip.show(ui.div(subParts[left]), e.x + 16, e.y + 16) : ui.tooltip.hide();
   }
 
   /**
@@ -186,6 +111,7 @@ export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
     const grid = gridCell.gridRow !== -1 ? gridCell.grid : undefined;
     const cell = gridCell.cell;
     const [type, subtype, paletteType] = gridCell.cell.column.getTag(DG.TAGS.UNITS).split(':');
+    const minDistanceRenderer = 50;
     w = grid ? Math.min(grid.canvas.width - x, w) : g.canvas.width - x;
     g.save();
     g.beginPath();
@@ -201,25 +127,34 @@ export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
     const palette = getPalleteByType(paletteType);
 
     const separator = gridCell.cell.column.getTag('separator') ?? '';
-    const splitterFunc: SplitterFunc = WebLogo.getSplitter(units, separator);
+    const splitLimit = gridCell.bounds.width / 5;
+    const splitterFunc: SplitterFunc = WebLogo.getSplitter(units, separator, gridCell.bounds.width / 5);
+
 
-    const columns = gridCell.cell.column.categories;
-    let monomerToShortFunction: (amino: string, maxLengthOfMonomer: number) => string = WebLogo.monomerToShort;
-    let maxLengthOfMonomer = 8;
+    const maxLengthOfMonomer = 8;
 
     let maxLengthWords: any = {};
-    if (gridCell.cell.column.getTag('.calculatedCellRender') !== 'exist') {
-      for (let i = 0; i < columns.length; i++) {
-        let subParts: string[] = splitterFunc(columns[i]);
+    if (gridCell.cell.column.getTag('.calculatedCellRender') !== splitLimit.toString()) {
+      let samples = 0;
+      while (samples < Math.min(gridCell.cell.column.length, 100)) {
+        let column = gridCell.cell.column.get(samples);
+        let subParts: string[] = splitterFunc(column);
         subParts.forEach((amino, index) => {
-          let textSizeWidth = g.measureText(monomerToShortFunction(amino, maxLengthOfMonomer));
-          if (textSizeWidth.width > (maxLengthWords[index] ?? 0)) {
-            maxLengthWords[index] = textSizeWidth.width;
+          let textSize = monomerToShortFunction(amino, maxLengthOfMonomer).length * 7 + gapRenderer;
+          if (textSize > (maxLengthWords[index] ?? 0)) {
+            maxLengthWords[index] = textSize;
           }
           if (index > (maxLengthWords['bio-maxIndex'] ?? 0)) {
             maxLengthWords['bio-maxIndex'] = index;
           }
         });
+        samples += 1;
+      }
+      let minLength = 3 * 7;
+      for (let i = 0; i <= maxLengthWords['bio-maxIndex']; i++) {
+        if (maxLengthWords[i] < minLength) {
+          maxLengthWords[i] = minLength;
+        }
       }
       let maxLengthWordSum: any = {};
       maxLengthWordSum[0] = maxLengthWords[0];
@@ -231,7 +166,7 @@ export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
         'bio-maxIndex': maxLengthWords['bio-maxIndex'],
         'bio-maxLengthWords': maxLengthWords
       };
-      gridCell.cell.column.setTag('.calculatedCellRender', 'exist');
+      gridCell.cell.column.setTag('.calculatedCellRender', splitLimit.toString());
     } else {
       maxLengthWords = gridCell.cell.column.temp['bio-maxLengthWords'];
     }
@@ -239,15 +174,19 @@ export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
     const subParts: string[] = splitterFunc(cell.value);
     let x1 = x;
     let color = undefinedColor;
-    let drawStyle = 'classic';
-    if (gridCell.cell.column.getTag('aligned').includes('MSA')) {
-      drawStyle = 'msa';
+    let drawStyle = DrawStyle.classic;
+    if (gridCell.cell.column.getTag('aligned').includes('MSA') && gridCell.cell.column.getTag('units') === 'separator') {
+      drawStyle = DrawStyle.MSA;
     }
-    subParts.forEach((amino, index) => {
+    subParts.every((amino, index) => {
       color = palette.get(amino);
       g.fillStyle = undefinedColor;
       let last = index === subParts.length - 1;
       x1 = printLeftOrCentered(x1, y, w, h, g, monomerToShortFunction(amino, maxLengthOfMonomer), color, 0, true, 1.0, separator, last, drawStyle, maxLengthWords, index, gridCell);
+      if (x1 - minDistanceRenderer - gridCell.gridColumn.left + (gridCell.gridColumn.left - gridCell.bounds.x) > gridCell.bounds.width) {
+        return false;
+      }
+      return true;
     });
 
     g.restore();