How to use the d3-array.ticks function in d3-array

To help you get started, we’ve selected a few d3-array 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 / d3-array / d3-array-tests.ts View on Github external
numbersArray = d3Array.range(10);
numbersArray = d3Array.range(1, 10);
numbersArray = d3Array.range(1, 10, 0.5);

// shuffle() -------------------------------------------------------------------

mergedArray = d3Array.shuffle(mergedArray);

mergedArray = d3Array.shuffle(mergedArray, 1);

mergedArray = d3Array.shuffle(mergedArray, 1, 3);

// ticks() ---------------------------------------------------------------------

numbersArray = d3Array.ticks(1, 10, 5);

// tickStep() ------------------------------------------------------------------

numbersArray = d3Array.tickStep(1, 10, 5);

// transpose() -----------------------------------------------------------------

testArrays = d3Array.transpose([
    [
        new MixedObject(10, new Date(2016, 6, 1)),
        new MixedObject(50, new Date(2017, 4, 15))
    ],
    [
        new MixedObject(40, new Date(2016, 3, 1)),
        new MixedObject(50, new Date(2016, 9, 30)),
    ]
github sentisis / charts-in-react / src / YAxis.js View on Github external
const YAsix = ({ data, height, margin }) => {
  const [min, max] = extent(data, d => d.value);
  const values = ticks(0, 100, 5);

  const y = scaleLinear()
    .range([0, height - margin.top - margin.bottom])
    .domain([max, min]);

  return (
    <div style="{{"></div>
github chunghe / React-Native-Stock-Chart / app / demos / D3Ticks.js View on Github external
getExclusiveTicks(start, end, count) {
    const ticks = d3Array.ticks(start, end, count);
    if (ticks.length &lt;= 1) {
      return ticks;
    }
    const interval = ticks[1] - ticks[0];
    if (ticks[0] - interval &lt;= 0) {
      return [...ticks, ticks[ticks.length - 1] + interval];
    }
    return [ticks[0] - interval, ...ticks, ticks[ticks.length - 1] + interval];
  }
github chunghe / React-Native-Stock-Chart / app / demos / D3Ticks.js View on Github external
d3Scale
        .scaleLinear()
        .domain([lowestPrice, highestPrice])
        .range([0, defaultStockChartHeight].reverse());
    const lineFunction =
      d3Shape
        .line()
        .x(d =&gt; timeScale(d.time * 1000))
        .y(d =&gt; priceScale(d.price));
    const areaFunction =
      d3Shape
        .area()
        .x(d =&gt; timeScale(d.time * 1000))
        .y(d =&gt; priceScale(d.price))
        .y1(() =&gt; priceScale(lowestPrice));
    const priceTicks = d3Array.ticks(lowestPrice, highestPrice, tickCounts);


    const adjustPriceTicks = this.getExclusiveTicks(lowestPrice, highestPrice, tickCounts);
    const adjustPriceScale =
      d3Scale
      .scaleLinear()
      .domain([adjustPriceTicks[0], adjustPriceTicks[adjustPriceTicks.length - 1]])
      .range([0, defaultStockChartHeight].reverse());
    const timeTicks = timeScale.ticks(tickCounts);

    return (
      
        Challenge
        1. ticks should be beatuiful number (multiply by 2, 5, 10)
        2. the interval of grid line should be equally distributed
github influxdata / influxdb / ui / src / minard / utils / plotEnvReducer.ts View on Github external
const getTicks = ([d0, d1]: number[], length: number): number[] => {
  const approxTickWidth =
    Math.max(String(d0).length, String(d1).length) * TICK_CHAR_WIDTH

  const TICK_DENSITY = 0.3
  const numTicks = Math.round((length / approxTickWidth) * TICK_DENSITY)
  const result = ticks(d0, d1, numTicks)

  return result
}
github Caleydo / lineage / src / genealogyTree.ts View on Github external
if (allDomain[0] &lt; filteredDomain[0]) {
      xRange.push(width * 0.05);
      xDomain.push(filteredDomain[0]);
      xTicks.push(filteredDomain[0]);


      x2Range.push(width * 0.05);
      x2Domain.push(filteredDomain[0]);

      //Add tick marks
      const leftRange = range(allDomain[0], filteredDomain[0], 10);
      x2Ticks = leftRange;

    }

    xTicks = xTicks.concat(ticks(filteredDomain[0], filteredDomain[1], 10));


    if (allDomain[1] !== filteredDomain[1]) {

      xRange.push(width * 0.95);
      xDomain.push(filteredDomain[1]);
      xTicks.push(filteredDomain[1]);

      xRange.push(width * 0.95);
      xDomain.push(filteredDomain[1]);

      xRange.push(width);
      xDomain.push(allDomain[1]);

      const rightRange = range(filteredDomain[1], allDomain[1], 10);
      xTicks = xTicks.concat(rightRange);
github d3 / d3-scale / src / linear.js View on Github external
scale.ticks = function(count) {
    var d = domain();
    return ticks(d[0], d[d.length - 1], count == null ? 10 : count);
  };
github d3 / d3-scale / src / log.js View on Github external
if (u &gt; 0) for (; i &lt;= j; ++i) {
        for (k = 1, p = pows(i); k &lt; base; ++k) {
          t = p * k;
          if (t &lt; u) continue;
          if (t &gt; v) break;
          z.push(t);
        }
      } else for (; i &lt;= j; ++i) {
        for (k = base - 1, p = pows(i); k &gt;= 1; --k) {
          t = p * k;
          if (t &lt; u) continue;
          if (t &gt; v) break;
          z.push(t);
        }
      }
      if (z.length * 2 &lt; n) z = ticks(u, v, n);
    } else {
      z = ticks(i, j, Math.min(j - i, n)).map(pows);
    }

    return r ? z.reverse() : z;
  };
github influxdata / giraffe / giraffe / src / utils / getTicks.ts View on Github external
export const getTicks = (
  domain: number[],
  rangeLength: number,
  charLength: number,
  formatter?: Formatter
): number[] => {
  const sampleTick = formatter(domain[1])
  const numTicks = getNumTicks(sampleTick, rangeLength, charLength)
  switch (formatter._GIRAFFE_FORMATTER_TYPE) {
    case FormatterType.Time:
      return getTimeTicks(domain, rangeLength, numTicks)

    default:
      return ticks(domain[0], domain[1], numTicks)
  }
}