Density

This tutorial shows how to display the Density log with the colormap. It can be visualized using geotoolkit/welllog/Log2DVisual.
The provided data is organized as a table: a collection of rows and columns inside the row. Specify values in vertical, horizontal, both directions.

# Density Log

This example displays two tracks. The first track contains bulk density along the length of a borehole, and the second track displays the gamma ray for the same depths.

import { Plot } from "@int/geotoolkit/plot/Plot.ts";
import { LogCurve } from "@int/geotoolkit/welllog/LogCurve.ts";
import { Log2DVisual, PlotTypes } from "@int/geotoolkit/welllog/Log2DVisual.ts";
import { DefaultColorProvider } from "@int/geotoolkit/util/DefaultColorProvider.ts";
import { TrackType } from "@int/geotoolkit/welllog/TrackType.ts";
import { HeaderType } from "@int/geotoolkit/welllog/header/LogAxisVisualHeader.ts";
import { Range } from "@int/geotoolkit/util/Range.ts";
import { Log2DDataRow } from "@int/geotoolkit/welllog/data/Log2DDataRow.ts";
import { Log2DVisualData } from "@int/geotoolkit/welllog/data/Log2DVisualData.ts";
import { LogData } from "@int/geotoolkit/welllog/data/LogData.ts";
import { AdaptiveLog2DVisualHeader } from "@int/geotoolkit/welllog/header/AdaptiveLog2DVisualHeader.ts";
import { curveData } from "/src/code/WellLog/utils/curveData.ts";
import { createWellLogWidget } from "/src/code/WellLog/utils/common.ts";
const DEFAULT_DARK_COLOR = "#757575";
function createScene(canvas) {
  const widget = createWellLogWidget().setAxisHeaderType(HeaderType.Simple);
  configureHeaders(widget);
  widget.addTrack(TrackType.IndexTrack);
  const colors = new DefaultColorProvider({
    "values": [2, 2.25, 2.5, 2.75, 3],
    "colors": ["#7cb342", "#fdd835", "#ef6c00", "#e64a19", "#732107"]
  });
  const startDepth = 4449.5, step = 0.5;
  const values = curveData["GR"];
  const depths = values.map((v, i) => startDepth + i * step);
  const rhob = curveData["RHOB"];
  const densityData = new Log2DVisualData();
  depths.forEach((depth, i) => {
    densityData.addRow(new Log2DDataRow(depth, [rhob[i], rhob[i]], [0, 2 * Math.PI]));
  });
  densityData.updateLimits();
  widget.addTrack(TrackType.LinearTrack).addChild(
    new Log2DVisual(densityData).setName("Density Range").setColorProvider(colors).setMicroPosition(0, 1).setPlotType(PlotTypes.Step)
  );
  const logData = new LogData({
    "name": "GR",
    "values": values,
    "depths": depths
  });
  widget.addTrack(TrackType.LinearTrack).addChild(
    new LogCurve(logData).setLineStyle({
      "color": "#ef6c00",
      "width": 2
    })
  );
  widget.addTrack(TrackType.IndexTrack);
  widget.setDepthLimits(new Range(logData.getMinDepth(), logData.getMaxDepth()));
  return new Plot({
    "canvaselement": canvas,
    "root": widget
  });
}
function configureHeaders(widget) {
  const densityHeader = new AdaptiveLog2DVisualHeader().setCursorEnabled(true).setTextStyle({
    "color": DEFAULT_DARK_COLOR
  }, true).setCursorValueTextStyle({
    "color": DEFAULT_DARK_COLOR
  }, true);
  widget.getHeaderContainer().getHeaderProvider().registerHeaderProvider(Log2DVisual.getClassName(), densityHeader);
}
export { createScene };

createScene(document.querySelector('[ref="plot"]'));