visual encodings

import * as uchi from "npm:uchimata";

//~ create a scene
let chromatinScene = uchi.initScene();
chromatinScene = uchi.addStructureToScene(
  chromatinScene,
  chrModel,
  {
    scale: 0.005,
    color: "crimson",
    links: true,
  });

const [renderer, canvas] = uchi.display(chromatinScene, { alwaysRedraw: false});

//~ ObservableHQ mechanism for clean-up after cell re-render
invalidation.then(() => renderer.endDrawing());

display(renderer.getCanvasElement());

//~ create a scene
let chromatinScene = uchi.initScene();
chromatinScene = uchi.addStructureToScene(
  chromatinScene,
  chrModel,
  {
    scale: 0.005,
    color: "crimson",
    // links: true,
  });

const [renderer, canvas] = uchi.display(chromatinScene, { alwaysRedraw: false});

//~ ObservableHQ mechanism for clean-up after cell re-render
invalidation.then(() => renderer.endDrawing());

display(renderer.getCanvasElement());

//~ create a scene
let chromatinScene = uchi.initScene();
chromatinScene = uchi.addStructureToScene(
  chromatinScene,
  chrModel,
  {
    scale: 0.008,
    color: "lightgreen",
    links: true,
    linksScale: 0.5,
  });

const [renderer, canvas] = uchi.display(chromatinScene, { alwaysRedraw: false});

//~ ObservableHQ mechanism for clean-up after cell re-render
invalidation.then(() => renderer.endDrawing());

display(renderer.getCanvasElement());

//~ create a scene
let chromatinScene = uchi.initScene();
chromatinScene = uchi.addStructureToScene(
  chromatinScene,
  chrModel,
  {
    scale: 0.02,
    color: "darkslateblue",
    // links: true,
    // linksScale: 0.5,
    mark: "box",
  });

const [renderer, canvas] = uchi.display(chromatinScene, { alwaysRedraw: false});

//~ ObservableHQ mechanism for clean-up after cell re-render
invalidation.then(() => renderer.endDrawing());

display(renderer.getCanvasElement());

//~ create a scene
let chromatinScene = uchi.initScene();
chromatinScene = uchi.addStructureToScene(
  chromatinScene,
  chrModel,
  {
    scale: 0.01,
    color: {
      field: "coord",
      min: 3100000,
      max: 130600000,
      colorScale: "Viridis",
    },
    links: true,
    // mark: "box",
  });

const [renderer, canvas] = uchi.display(chromatinScene, { alwaysRedraw: false});

//~ ObservableHQ mechanism for clean-up after cell re-render
invalidation.then(() => renderer.endDrawing());

display(renderer.getCanvasElement());

//~ create a scene
let chromatinScene = uchi.initScene();
chromatinScene = uchi.addStructureToScene(
  chromatinScene,
  chrModel,
  {
    scale: {
      field: "coord",
      min: 3100000,
      max: 130600000,
      scaleMax: 0.01,
      scaleMin: 0.001,
    },
    color: {
      field: "coord",
      min: 3100000,
      max: 130600000,
      colorScale: "Spectral",
    },
    links: true,
    // mark: "box",
  });

const [renderer, canvas] = uchi.display(chromatinScene, { alwaysRedraw: false});

//~ ObservableHQ mechanism for clean-up after cell re-render
invalidation.then(() => renderer.endDrawing());

display(renderer.getCanvasElement());

const urlStevens = "https://pub-5c3f8ce35c924114a178c6e929fc3ac7.r2.dev/Stevens-2017_GSM2219497_Cell_1_model_5.arrow";

const model = await uchi.loadFromURL(urlStevens, {
  center: true,
  normalize: true,
});

const chrModel = {
  data: await uchi.selectChromosome(model.data, "chr j")
}