TypeScript d3-dispatch.dispatch函數代碼示例

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(_) {
//.........這裏部分代碼省略.........

// Preparation --------------------------------------------

interface Datum {
    a: number;
    b: string;
}

let dispatch: d3Dispatch.Dispatch<HTMLElement>;
let callback: (this: HTMLElement, ...args: any[]) => void;
let callbackOrUndef: ((this: HTMLElement, ...args: any[]) => void) | undefined;
let undef: undefined;

// Signature Tests ----------------------------------------

// create new dispatch object
dispatch = d3Dispatch.dispatch('foo', 'bar');

function cbFn(this: HTMLElement, d: Datum, i: number) {
    console.log(this.baseURI ? this.baseURI : 'nada');
    console.log(d ? d.a : 'nada');
}

function cbFn2(this: SVGElement, d: Datum, i: number) {
    console.log(this.baseURI ? this.baseURI : 'nada');
    console.log(d ? d.a : 'nada');
}

dispatch.on('foo', cbFn);
// $ExpectError
dispatch.on('foo', cbFn2); // test fails as 'this' context type is mismatched between dispatch and callback function

export function d3Cloud() {
    const event = dispatch("word", "end");
    const cloud: any = {};

    let size = [256, 256];
    let text = cloudText;
    let font = cloudFont;
    let fontSize = cloudFontSize;
    let fontStyle = cloudFontNormal;
    let fontWeight = cloudFontNormal;
    let rotate = cloudRotate;
    let padding = cloudPadding;
    let words = [];
    let spiral = archimedeanSpiral;
    let timeInterval = Infinity;
    let timer = null;
    let random = Math.random;
    let canvas = cloudCanvas;

    cloud.canvas = function (_) {
        return arguments.length ? (canvas = functor(_), cloud) : canvas;
    };

    cloud.start = function () {
        const contextAndRatio = getContext(canvas());
        const board = zeroArray((size[0] >> 5) * size[1]);
        let bounds = null;
        const n = words.length;
        let i = -1;
        const tags = [];
        const data = words.map(function (d, i) {
            d.text = text.call(this, d, i);
            d.font = font.call(this, d, i);
            d.style = fontStyle.call(this, d, i);
            d.weight = fontWeight.call(this, d, i);
            d.rotate = rotate.call(this, d, i);
            d.size = ~~fontSize.call(this, d, i);
            d.padding = padding.call(this, d, i);
            return d;
        }).sort(function (a, b) { return b.size - a.size; });

        if (timer) clearInterval(timer);
        timer = setInterval(step, 0);
        step();

        return cloud;

        function step() {
            const start = Date.now();
            while (Date.now() - start < timeInterval && ++i < n && timer) {
                const d = data[i];
                d.x = (size[0] * (random() + .5)) >> 1;
                d.y = (size[1] * (random() + .5)) >> 1;
                cloudSprite(contextAndRatio, d, data, i);
                if (d.hasText && place(board, d, bounds)) {
                    tags.push(d);
                    event.call("word", cloud, d);
                    if (bounds) cloudBounds(bounds, d);
                    else bounds = [{ x: d.x + d.x0, y: d.y + d.y0 }, { x: d.x + d.x1, y: d.y + d.y1 }];
                    // Temporary hack
                    d.x -= size[0] >> 1;
                    d.y -= size[1] >> 1;
                }
            }
            if (i >= n) {
                cloud.stop();
                event.call("end", cloud, tags, bounds);
            }
        }
    };

    cloud.stop = function () {
        if (timer) {
            clearInterval(timer);
            timer = null;
        }
        return cloud;
    };

    function getContext(canvas) {
        canvas.width = canvas.height = 1;
        const ratio = Math.sqrt(canvas.getContext("2d").getImageData(0, 0, 1, 1).data.length >> 2);
        canvas.width = (cw << 5) / ratio;
        canvas.height = ch / ratio;

        const context = canvas.getContext("2d");
        context.fillStyle = context.strokeStyle = "red";
        context.textAlign = "center";

        return { context, ratio };
    }

    function place(board, tag, bounds) {
        const startX = tag.x;
        const startY = tag.y;
        const maxDelta = Math.sqrt(size[0] * size[0] + size[1] * size[1]);
        const s = spiral(size);
        const dt = random() < .5 ? 1 : -1;
        let t = -dt;
        let dxdy;
//.........這裏部分代碼省略.........