Sequential Scales

/**
 * Creates a sequential scale with optional interpolation function
 * @param interpolator - Function to interpolate between 0 and 1
 * @returns SequentialScale instance
 */
function scaleSequential(interpolator?: InterpolatorFunction): SequentialScale;

interface SequentialScale {
  /** Apply sequential transformation to domain value */
  (value: number): any;
  
  /** Get or set the input domain [min, max] */
  domain(): [number, number];
  domain(domain: [number, number]): this;
  
  /** Get or set the interpolation function */
  interpolator(): InterpolatorFunction;
  interpolator(interpolator: InterpolatorFunction): this;
  
  /** Set range using interpolator between two values */
  range(): [any, any];
  range(range: [any, any]): this;
  
  /** Set range with rounding interpolator */
  rangeRound(range: [number, number]): this;
  
  /** Enable or disable range clamping */
  clamp(): boolean;
  clamp(clamp: boolean): this;
  
  /** Generate approximately count representative values from domain */
  ticks(count?: number): number[];
  
  /** Format tick values for display */
  tickFormat(count?: number, specifier?: string): (n: number) => string;
  
  /** Extend domain to nice round values */
  nice(count?: number): this;
  
  /** Create independent copy */
  copy(): SequentialScale;
  
  /** Get or set unknown value handling */
  unknown(): any;
  unknown(value: any): this;
}

import { scaleSequential } from "d3-scale";
import { interpolateViridis, interpolateRdYlBu } from "d3-scale-chromatic";

// Color scale for heatmap
const colorScale = scaleSequential()
  .domain([0, 100])
  .interpolator(interpolateViridis);

console.log(colorScale(0));   // Dark purple (start of viridis)
console.log(colorScale(50));  // Green (middle of viridis)  
console.log(colorScale(100)); // Bright yellow (end of viridis)

// Diverging color scale  
const tempScale = scaleSequential()
  .domain([-10, 40])
  .interpolator(interpolateRdYlBu);

console.log(tempScale(-5)); // Blue (cold)
console.log(tempScale(25)); // Yellow (warm)

// Custom interpolator
const opacityScale = scaleSequential()
  .domain([0, 1])
  .interpolator(t => `rgba(255, 0, 0, ${t})`);

console.log(opacityScale(0.5)); // "rgba(255, 0, 0, 0.5)"

/**
 * Creates a sequential scale with power transformation
 * @param interpolator - Optional interpolation function
 * @returns SequentialScale with power transformation
 */
function scaleSequentialPow(interpolator?: InterpolatorFunction): SequentialScale;

/**
 * Creates a sequential scale with square root transformation
 * @param interpolator - Optional interpolation function  
 * @returns SequentialScale with sqrt transformation
 */
function scaleSequentialSqrt(interpolator?: InterpolatorFunction): SequentialScale;

interface SequentialPowerScale extends SequentialScale {
  /** Get or set the power exponent */
  exponent(): number;
  exponent(exponent: number): this;
}

import { scaleSequentialPow, scaleSequentialSqrt } from "d3-scale";
import { interpolatePlasma } from "d3-scale-chromatic";

// Power scale for non-linear color mapping
const powerColorScale = scaleSequentialPow()
  .domain([1, 1000])
  .exponent(0.5)  // Square root
  .interpolator(interpolatePlasma);

// Equivalent sqrt scale
const sqrtColorScale = scaleSequentialSqrt()
  .domain([1, 1000])
  .interpolator(interpolatePlasma);

console.log(powerColorScale(100)); // Color for sqrt-transformed value

/**
 * Creates a sequential scale with logarithmic transformation
 * @param interpolator - Optional interpolation function
 * @returns SequentialScale with log transformation
 */
function scaleSequentialLog(interpolator?: InterpolatorFunction): SequentialScale;

interface SequentialLogScale extends SequentialScale {
  /** Get or set the logarithm base */
  base(): number;
  base(base: number): this;
}

/**
 * Creates a sequential scale with symmetric logarithmic transformation
 * @param interpolator - Optional interpolation function
 * @returns SequentialScale with symlog transformation
 */
function scaleSequentialSymlog(interpolator?: InterpolatorFunction): SequentialScale;

interface SequentialSymlogScale extends SequentialScale {
  /** Get or set the symlog constant */
  constant(): number;
  constant(constant: number): this;
}

import { scaleSequentialLog, scaleSequentialSymlog } from "d3-scale";
import { interpolateInferno } from "d3-scale-chromatic";

// Log scale for data spanning orders of magnitude
const logColorScale = scaleSequentialLog()
  .domain([1, 10000])
  .base(10)
  .interpolator(interpolateInferno);

console.log(logColorScale(10));   // Color for log10(10) = 1
console.log(logColorScale(1000)); // Color for log10(1000) = 3

// Symlog scale for data including negative values
const symlogColorScale = scaleSequentialSymlog()
  .domain([-1000, 1000])
  .constant(1)
  .interpolator(interpolateInferno);

console.log(symlogColorScale(-100)); // Color for negative value
console.log(symlogColorScale(0));    // Color for zero
console.log(symlogColorScale(100));  // Color for positive value

/**
 * Creates a sequential scale using quantiles from sample data
 * @param interpolator - Optional interpolation function
 * @returns SequentialQuantileScale instance
 */
function scaleSequentialQuantile(interpolator?: InterpolatorFunction): SequentialQuantileScale;

interface SequentialQuantileScale {
  /** Apply quantile-based sequential transformation */
  (value: number): any;
  
  /** Get or set the sample data used to compute quantiles */
  domain(): number[];
  domain(domain: number[]): this;
  
  /** Get the computed quantiles */
  quantiles(): number[];
  
  /** Get or set the interpolation function */
  interpolator(): InterpolatorFunction;
  interpolator(interpolator: InterpolatorFunction): this;
  
  /** Create independent copy */
  copy(): SequentialQuantileScale;
  
  /** Get or set unknown value handling */
  unknown(): any;
  unknown(value: any): this;
}

import { scaleSequentialQuantile } from "d3-scale";
import { interpolateCool } from "d3-scale-chromatic";

// Create quantile-based color scale from actual data
const data = [1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144];

const quantileColorScale = scaleSequentialQuantile()
  .domain(data)  // Uses actual data distribution
  .interpolator(interpolateCool);

console.log(quantileColorScale.quantiles()); // Array of computed quantiles
console.log(quantileColorScale(21)); // Color based on 21's position in data distribution

// Equal treatment regardless of value clustering
console.log(quantileColorScale(3));  // Low quantile color
console.log(quantileColorScale(55)); // High quantile color

import { scaleSequential } from "d3-scale";
import { 
  interpolateViridis,
  interpolatePlasma, 
  interpolateInferno,
  interpolateMagma,
  interpolateWarm,
  interpolateCool,
  interpolateRainbow,
  interpolateCubehelixDefault
} from "d3-scale-chromatic";

// Various color schemes
const schemes = {
  viridis: scaleSequential().interpolator(interpolateViridis),
  plasma: scaleSequential().interpolator(interpolatePlasma), 
  warm: scaleSequential().interpolator(interpolateWarm),
  rainbow: scaleSequential().interpolator(interpolateRainbow)
};

import { scaleSequential } from "d3-scale";
import { interpolateRgb } from "d3-interpolate";

// Custom two-color interpolator
const customScale = scaleSequential()
  .domain([0, 100])
  .interpolator(interpolateRgb("steelblue", "orange"));

// Multi-stop interpolator
const multiColorScale = scaleSequential()
  .domain([0, 100])
  .interpolator(t => {
    if (t < 0.5) return interpolateRgb("blue", "white")(t * 2);
    return interpolateRgb("white", "red")((t - 0.5) * 2);
  });

type InterpolatorFunction = (t: number) => any;