d3 / d3-dispatch

Register named callbacks and call them with arguments.

d3-dispatch

Dispatching is a low-level interaction mechanism that allows you to register named callbacks and then call them with arbitrary arguments. A variety of D3 interaction components, such as d3-drag, use this mechanism to emit events to listeners. Think of this like Node’s EventEmitter, except every listener has a well-defined name so it’s easy to remove or replace them.

Resources

• Documentation
• Examples
• Releases
• Getting help

d3-dispatch's Issues

Observable collection is empty

Both repo description and readme link to https://observablehq.com/collection/@d3/d3-dispatch, but the collection does not contain any public notebooks.

Compose submodule with ES6

I write the issue here because d3/d3 issues are closed, but this is a general problem of submodules.

I'm trying to use ES6 to make my own bundle of d3 because I don't need the whole library. I know that d3 use the global/exposed d3 object to allocate some data or flags. I think there is the problem.

Because If I use this:

import * as d3dispatch from 'd3-dispatch'
import * as d3drag from 'd3-drag'
import * as d3selection from 'd3-selection'
import * as d3transition from 'd3-transition'
import * as d3zoom from 'd3-zoom'

const d3 = Object.assign({}, d3dispatch, d3drag, d3drag, d3selection, d3zoom)

Won't work in some situations. Any Idea of how to use the same d3 object for all the imports?

Don’t expose the dispatch.type.

The problem is the dynamic type field pollutes the public interface: I can never add a new method (e.g., dispatch.copy) because it might conflict with an event of the same type. That even applies to private fields! For example, trying to create an event type named “_” currently fails.

I should change the API as follows:

dispatch.foo.call(object, arg1, arg2); // BEFORE
dispatch.call("foo", object, arg1, arg2); // AFTER

dispatch.foo.apply(object, [arg1, arg2]); // BEFORE
dispatch.apply("foo", object, [arg1, arg2]); // AFTER

Register with bower.

Strange behavior in Safari v9

I'm hesitant to report this here because the issue is so intermittent that I'm positive it's a safari bug.

If you run the following gist (gist: https://gist.github.com/Hypercubed/c4276ed96ff4bd575933c7ad390a7a92, block: http://bl.ocks.org/Hypercubed/c4276ed96ff4bd575933c7ad390a7a92) in chrome or firefox you see the expected result. "called 3000 times total" is written to the DOM.

But run in Safari v9, (and this is crucial) with the debugging console closed, I see undefined value at XXXX. The value that the undefined value starts and ends varies between refreshes.

Seems like a browser bug, but I only see this behavior in d3-dispatch: https://github.com/Hypercubed/EventsSpeedTests/blob/master/results/safari-v9.md

dispatch.once?

It might be nice to have a dispatch.once method that automatically removes the callback after it is invoked once.

Either fail gracefully or emit useful error message .on("unknownEvent")

Using .on to listen to an event that doesn't exist triggers an error on

d3-dispatch/src/dispatch.js

Line 19 in b2944af

if (t && !types.hasOwnProperty(t)) throw new Error;

Possible solutions:

• parseTypenames filters out undefined event types
• error alerts the full event name that couldn't be matched to an event

Add dispatch.copy.

For d3/d3-transition#27, we’ll want an easy way to create a copy of a dispatch.

API Proposal

When using this library, I have found it cumbersome to always specify the second argument of dispatch.call, which I have never had a use for so ends up being null, like this:

dispatch.call("start", null, "I am an argument")

Proposal for additional API, which would not support any this arg:

dispatch("start", "I am an argument")

Any thoughts?

Don’t allow whitespace or periods in dispatch(types).

This would be bad:

var dispatch = d3.dispatch("start end");

As would this:

var dispatch = d3.dispatch("start.foo");

It might be nice if we treated the former as equivalent to:

var dispatch = d3.dispatch("start", "end");

And threw an error on the latter.

Rewrite without using closures.

The closures here make it a lil’ expensive to construct a new dispatch object. It’d be nice, say for transitions, to make constructing the dispatcher as cheap as possible. Probably means changing the API from this:

dispatch.foo.call(that, arg1, arg2); 

To this:

dispatch.call("foo", that, arg1, arg2); 

Or maybe dispatch.dispatch? You get the idea.

Why is `^|\s+` used instead of just `\s+` in .split()?

On the following lines, ^|\s+ is used:

d3-dispatch/src/dispatch.js

Lines 15 to 17 in 893b6f4

	function parseTypenames(typenames, types) {
	return typenames.trim().split(/^|\s+/).map(function(t) {
	var name = "", i = t.indexOf(".");

Does that do anything different from what just \s+ would do?

It causes problems when trying to use this library in QML environment (V4 JS engine from Qt).
Ref: QTBUG-62471.

dispatch.on(types, listener) should take multiple types.

For example, dispatch.on("change input", listener). Related d3/d3-selection#59.

Fix prototype.constructor.

The current definition obliterates the constructor property.

• Dispatch

Example in docs uses the 3.x API

I realised while reading the changes for d3-dispatch,
that the example linked in the documentation is using the 3.x version of the API, and that may be confusing to readers as it was for me.

(I forked your gist and updated it to use the 4.x version: https://bl.ocks.org/meghna/cd3234b682bbd427ee85ea2378a0ca83)

Thanks!

Throw an error if the specified callback is not null and not a function.

Support for multiple callbacks

If a callback was already registered for the given typenames, the existing callback is removed before the new callback is added.

Have you considered allowing multiple callbacks for a given typename?