TypeScript d3-timer.timer函数代码示例

export function animateBench(f: (elapsed: number) => void) : void {
	const timer = runTimer((elapsed: number) => {
		f(elapsed)
		if (elapsed > 60 * 1000) {
			timer.stop()
		}
	})
}

export function measure(sec: number, drawFPS: (fps: string) => void) : void {
	let ctr = 0

	timer(() => ctr++)

	interval(() => {
		drawFPS((ctr / sec).toPrecision(3))
		ctr = 0
	}, 1000 * sec)
}

export default function(nodes) {
  var simulation,
      alpha = 1,
      alphaMin = 0.001,
      alphaDecay = 1 - Math.pow(alphaMin, 1 / 300),
      alphaTarget = 0,
      drag = 0.6,
      forces = map(),
      fixes = {},
      stepper = timer(step),
      event = dispatch("tick", "end");

  if (nodes == null) nodes = [];

  function step() {
    tick();
    event.call("tick", simulation);
    if (alpha < alphaMin) {
      stepper.stop();
      event.call("end", simulation);
    }
  }

  function tick() {
    var i, n = nodes.length, node, fix;

    alpha += (alphaTarget - alpha) * alphaDecay;

    forces.each(function(force) {
      force(alpha);
    });

    for (i = 0; i < n; ++i) {
      node = nodes[i];
      node.x += node.vx *= drag;
      node.y += node.vy *= drag;
    }

    for (i in fixes) {
      fix = fixes[i], node = nodes[i];
      node.x = fix.x;
      node.y = fix.y;
      node.vx =
      node.vy = 0;
    }
  }

  function initializeNodes() {
    for (var i = 0, n = nodes.length, node; i < n; ++i) {
      node = nodes[i], node.index = i;
      if (isNaN(node.x) || isNaN(node.y)) {
        var radius = initialRadius * Math.sqrt(i), angle = i * initialAngle;
        node.x = radius * Math.cos(angle);
        node.y = radius * Math.sin(angle);
      }
      if (isNaN(node.vx) || isNaN(node.vy)) {
        node.vx = node.vy = 0;
      }
    }
  }

  function initializeForce(force) {
    if (force.initialize) force.initialize(nodes);
    return force;
  }

  initializeNodes();

  return simulation = {
    tick: tick,

    restart: function() {
      return stepper.restart(step), simulation;
    },

    stop: function() {
      return stepper.stop(), simulation;
    },

    nodes: function(_) {
      return arguments.length ? (nodes = _, initializeNodes(), forces.each(initializeForce), simulation) : nodes;
    },

    alpha: function(_) {
      return arguments.length ? (alpha = +_, simulation) : alpha;
    },

    alphaMin: function(_) {
      return arguments.length ? (alphaMin = +_, simulation) : alphaMin;
    },

    alphaDecay: function(_) {
      return arguments.length ? (alphaDecay = +_, simulation) : +alphaDecay;
    },

    alphaTarget: function(_) {
      return arguments.length ? (alphaTarget = +_, simulation) : alphaTarget;
    },

    drag: function(_) {
//.........这里部分代码省略.........

/**
 * Typescript definition tests for d3/d3-timer module
 *
 * Note: These tests are intended to test the definitions only
 * in the sense of typing and call signature consistency. They
 * are not intended as functional tests.
 */

import * as d3Timer from 'd3-timer';

// Test now definition
const now: number = d3Timer.now();

// Test timer and timerFlush definitions ------------

let t0: d3Timer.Timer = d3Timer.timer((elapsed: number) => { console.log(elapsed); });
let t1: d3Timer.Timer = d3Timer.timer((elapsed: number) => { console.log(elapsed); }, 150);
let t2: d3Timer.Timer = d3Timer.timer((elapsed: number) => { console.log(elapsed); }, 150, performance.now() || Date.now());

t0.restart((elapsed: number) => { console.log(elapsed); });
t0.restart((elapsed: number) => { console.log(elapsed); }, 150);
t0.restart((elapsed: number) => { console.log(elapsed); }, 150, performance.now() || Date.now());
t0.stop();

d3Timer.timerFlush();

t1.stop(); t2.stop();

// Test timeout Timer definitions  --------------------------------

t0 = d3Timer.timeout((elapsed: number) => { console.log(elapsed); });

//.........这里部分代码省略.........
		}

		this.tree = new SegmentTree(this.data, this.data.length, this.buildSegmentTreeTuple)

		// в референсном окне видны все данные, поэтому
		// передаем bIndexFull в качестее bIndexVisible
		updateScales(this.bIndexFull)

		const xAxis = new MyAxis(Orientation.Bottom, x)
			.ticks(4)
			// изменять размер тиков надо при изменении
			// размеров окна
			.setTickSize(height)
			.setTickPadding(8 - height)

		const yAxis = new MyAxis(Orientation.Right, y)
			.ticks(4, 's')
			.setTickSize(width)
			.setTickPadding(2 - width)

		const gX = bindAxisToDom(svg, xAxis, x)
		const gY = bindAxisToDom(svg, yAxis, y)

		// it's important that we have only 1 instance
		// of drawProc and not one per event
		// вызывается из zoom и drawNewData
		const scheduleRefresh = drawProc(() => {
			const bIndexVisible = pathTransform.fromScreenToModelBasisX(bScreenXVisible)
			updateScales(bIndexVisible)
			pathTransform.updateViewNode()

			xAxis.axisUp(gX)
			yAxis.axisUp(gY)
		})
		pathTransform.onViewPortResize(bScreenXVisible, bScreenYVisible)
		pathTransform.onReferenceViewWindowResize(this.bIndexFull, bPlaceholder)
		svg.append('rect')
			.attr('class', 'zoom')
			.attr('width', width)
			.attr('height', height)
			.call(d3zoom()
				.scaleExtent([1, 40])
				// в перспективе взять экстент из bScreenVisible
				// хотя хез как быть с другим порядком
				.translateExtent([[0, 0], [width, height]])
				.on('zoom', this.zoomHandler.bind(this)))

		// вызывается здесь ниже
		// и из публичного updateChartWithNewData()
		// но в принципе должно быть в common.ts
		this.drawNewData = () => {
			// создание дерева не должно
			// дублироваться при создании чарта
			this.tree = new SegmentTree(this.data, this.data.length, this.buildSegmentTreeTuple)
			const drawLine = (cityIdx: number) => line()
				.defined((d: [number, number]) => {
					return !(isNaN(d[cityIdx]) || d[cityIdx] == null)
				})
				.x((d: [number, number], i: number) => i)
				.y((d: [number, number]) => d[cityIdx])

			path.attr('d', (cityIndex: number) => drawLine(cityIndex).call(null, this.data))
			scheduleRefresh()
		}

		this.drawNewData()

		// публичный метод, используется для ретрансляции
		// зум-события нескольким графикам
		this.zoom = () => {
			pathTransform.onZoomPan(d3event.transform)
			scheduleRefresh()
		}

		function raisedCos(elapsed: number) {
			return -(Math.cos(elapsed / 6500) - 1) / 2
		}

		function animateCosDown(maxX: number, minX: number, elapsed: number) {
			return maxX - (maxX - minX) * raisedCos(elapsed)
		}

		let offsetX = 0
		let offsetDelta = 100
		let panDirection = 1
		const f = (elapsed: number) => {
			pathTransform.onZoomPan(zoomIdentity.translate(-1000 + offsetX * panDirection, 0).scale(40))
			offsetX = offsetX + offsetDelta
			panDirection = -panDirection
			offsetDelta = offsetX > 1000 || offsetX < 0 ? -offsetDelta : offsetDelta
			scheduleRefresh()
		}

		const timer = runTimer((elapsed: number) => {
			f(elapsed)
			if (elapsed > 60 * 1000) {
				timer.stop()
			}
		})
	}