A Pointer
interaction allows the user to trigger an event when a Pointer
enters, exits, or moves within a Component
.
var data = [];
for (var i = 0; i < 250; i++) { data.push({"x": i, "y": Math.random()}); }
var xScale = new Plottable.Scales.Linear();
var yScale = new Plottable.Scales.Linear();
var plot = new Plottable.Plots.Scatter()
.x(function(d) { return d.x; }, xScale)
.y(function(d) { return d.y; }, yScale)
.addDataset(new Plottable.Dataset(data));
var interaction = new Plottable.Interactions.Pointer();
interaction.onPointerMove(function(p) {
plot.entities().forEach(function(entity) {
entity.selection.attr("fill", "#5279C7");
});
var entity = plot.entityNearest(p);
entity.selection.attr("fill", "red");
});
interaction.attachTo(plot);
plot.renderTo("svg#example");
.offPointerEnter(callback)
Removes a callback that would be called when the pointer enters the Component.
.offPointerExit(callback)
Removes a callback that would be called when the pointer exits the Component.
.offPointerMove(callback)
Removes a callback that would be called when the pointer moves within the Component.
.onPointerEnter(callback)
Adds a callback to be called when the pointer enters the Component.
.onPointerExit(callback)
Adds a callback to be called when the pointer exits the Component.
.onPointerMove(callback)
Adds a callback to be called when the pointer moves within the Component.