How to use the d3-scale.scaleLog function in d3-scale

To help you get started, we’ve selected a few d3-scale examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github DefinitelyTyped / DefinitelyTyped / types / d3-scale / d3-scale-tests.ts View on Github external
// copy(...) -----------------------------------------------------------------

const copiedPowerScale: d3Scale.ScalePower = powerScaleNumString.copy();

// -------------------------------------------------------------------------------
// Logarithmic Scale Factory
// -------------------------------------------------------------------------------

// scaleLog() ---------------------------------------------------------------------

let logScaleNumber: d3Scale.ScaleLogarithmic;
let logScaleString: d3Scale.ScaleLogarithmic;
let logScaleNumString: d3Scale.ScaleLogarithmic;

logScaleNumber = d3Scale.scaleLog();
logScaleString = d3Scale.scaleLog();
logScaleNumString = d3Scale.scaleLog();

// ScaleLogarithmic Interface ========================================================

// base --------------------------------------------------------------------

const base: number = logScaleNumber.base();

logScaleNumber = logScaleNumber.base(42);

// domain(...) -----------------------------------------------------------------

logScaleNumber = logScaleNumber.domain(domainNumeric);
logScaleNumber = logScaleNumber.domain(domainNumbers);
domainNumbers = logScaleNumber.domain();
github tmobile / pacbot / webapp / src / app / pacman-features / secondary-components / multiline-brush-zoom / multiline-brush-zoom.component.ts View on Github external
}
    } else {
      this.yLogAxis = true;
      this.y = d3Scale.scaleLog().range([this.height, 0]);

      this.y.domain([
        1,
        d3Array.max(this.graphData, (c) => {
          return d3Array.max(c[`values`], (d) => {
            return d[`value`];
          });
        })
      ]);
    }
    this.x2 = d3Scale.scaleTime().range([0, this.timeLineWidth]);
    this.y2 = d3Scale.scaleLog().range([this.height2, 0]);

    // To get the starting and ending dates within which data value is > 0
    this.getDataRangePoints();

    // this.x.domain(d3Array.extent(this.data, (d: Date) => d ));

    this.x.domain([this.dataStartDate, this.dataEndDate]);
    // Note : You can add '.nice()' function at the end of this.x.domain() to have evenly spaced ticks with starting and
    //        ending point included

    // this.x2.domain(d3Array.extent(this.data, (d: Date) => d ));

    this.x2.domain([this.dataStartDate, this.dataEndDate]);
    // Note : You can add '.nice()' function at the end of this.x.domain() to have evenly spaced ticks with starting and
    //        ending point included
github FormidableLabs / victory / test / client / spec / helpers / scale.spec.js View on Github external
it("returns 'log' for log scales", () => {
      const props = {scale: {x: d3Scale.scaleLog()}};
      const scaleType = Scale.getScaleType(props, "x");
      expect(Scale.getScaleTypeFromProps).calledWith(props, "x").and.returned("log");
      expect(Scale.getScaleTypeFromData).not.called;
      expect(scaleType).to.equal("log");
    });
github esnet / react-timeseries-charts / src / components / ChartRow.js View on Github external
function createScale(yaxis, type, min, max, y0, y1) {
    let scale;
    if (_.isUndefined(min) || _.isUndefined(max)) {
        scale = null;
    } else if (type === "linear") {
        scale = scaleLinear()
            .domain([min, max])
            .range([y0, y1])
            .nice();
    } else if (type === "log") {
        const base = yaxis.props.logBase || 10;
        scale = scaleLog()
            .base(base)
            .domain([min, max])
            .range([y0, y1]);
    } else if (type === "power") {
        const power = yaxis.props.powerExponent || 2;
        scale = scalePow()
            .exponent(power)
            .domain([min, max])
            .range([y0, y1]);
    }
    return scale;
}
github macarthur-lab / gnomadjs / packages / track-navigator / src / Navigator.js View on Github external
import { scaleLog } from 'd3-scale'
import PropTypes from 'prop-types'
import React, { Component } from 'react'
import styled from 'styled-components'

import { VariantPlot } from '@broad/track-variant'

import PositionAxis from './PositionAxis'

const afScale = scaleLog()
  .domain([0.00001, 0.001])
  .range([4, 12])

const NavigatorContainer = styled.div`
  position: relative;
  display: flex;
  flex-direction: column;
  width: ${props => props.width}px;
  cursor: pointer;
`

const NavigatorOverlay = styled.svg`
  position: absolute;
  top: 0;
  left: 0;
`
github zachwinter / wavesync / src / wavesync / sync.js View on Github external
}

    /** Add volume value to the beginning of the beat queue. */
    queues.beat.unshift(volume)

    /** If the queue is larger than our defined smoothing value, remove the last value. */
    if (queues.beat.length > this.state.volumeSmoothing) {
      queues.beat.pop()
    }

    function average (arr) {
      return arr.reduce((a, b) => (a + b)) / arr.length
    }

    /** Scale volume (dB) to a linear range using the minimum and average values of the volume queue. */
    const sizeScale = scaleLog()
      .domain([min(queues.volume), average(queues.volume)])
      .range([0, 1])

    /** Average the beat queue, then pass it to our size scale. */
    const beat = average(queues.beat)
    this.volume = sizeScale(beat)
  }
github higlass / higlass / app / scripts / ValueIntervalTrack.js View on Github external
drawTile(tile) {
    if (!tile.graphics) { return; }

    const graphics = tile.graphics;
    const RECT_HEIGHT = 6;
    const MIN_RECT_WIDTH = 4;

    graphics.clear();

    this.valueScale = scaleLog()
      .domain([this.minValue() + 0.01, this.maxValue()])
      .range([this.dimensions[1] - RECT_HEIGHT / 2, RECT_HEIGHT / 2]);

    const fill = colorToHex('black');

    graphics.lineStyle(1, fill, 0.3);
    graphics.beginFill(fill, 0.3);

    this.drawAxis(this.valueScale);

    tile.tileData.forEach((td) => {
      const fields = td.fields;

      const chrOffset = +td.chrOffset;
github mcnuttandrew / forum-explorer / src / layouts / time-embed-y.js View on Github external
getYScale: ({height, margin}, root) => {
    const {yMin, yMax} = getDomain(root, d => [getX(d), getY(d)]);
    const scale1 = scaleLinear().domain([yMin, yMax]).range([1, (yMax - yMin)]);
    const scale2 = scaleLog().domain([1, (yMax - yMin)]).range(yRange(height, margin));
    return x => scale2(scale1(x));
  },
  positioning: (xScale, yScale) => d => [xScale(d.x), yScale(getY(d))],
github khartec / waltz / waltz-ng / client / playpen / 3 / asset-cost-graph.js View on Github external
function mkScales(amounts = [], scaleType = 'log') {
    const [minAmount, maxAmount] = extent(amounts, getAmount);

    const baseYScale = scaleType === 'log'
            ? scaleLog()
            : scaleLinear();

    return {
        x: scaleLinear()
            .domain([0, amounts.length])
            .range([0, dimensions.graph.width]),
        y: baseYScale
            .domain([minAmount / 1.5, maxAmount * 1.2])
            .range([dimensions.graph.height, 0])
    }
}
github wikimedia / analytics-wikistats2 / src / components / detail / chart / MapChart / MapChart.vue View on Github external
getDataByCountry () {
            const colorPalette = d3_color.interpolateGnBu;
            let {min, max} = this.graphModel.getMinMax();
            const d3s = scales.scaleLog()
                    .domain([min, max])
                    .range([0,1]);
            const scale = (number) => {
                return colorPalette(d3s(number));
            };
            scale.min = min;
            scale.max = max;
            this.colorScale = scale;

            this.dataByCountry = this.graphModel.graphData.reduce((p,c) => {
                p[c.country] = c.total.total;
                return p;
            }, {});
        },