Commit 4c262a0b authored by Sascha Herzinger's avatar Sascha Herzinger
Browse files

added brush

parent 49364c64
......@@ -41,6 +41,7 @@
function update() {
scatterplot.update({
values: generateRandomData(1000, -100, 100),
callback: d => console.log(d),
});
}
......
......@@ -4,6 +4,10 @@
position: absolute;
}
.ac-scatter-svg {
position: relative;
}
.ac-scatter-axis {
shape-rendering: crispEdges;
}
......
......@@ -12,6 +12,7 @@ export default class extends Chart {
.attr('class', 'ac-scatter-canvas');
this.svg = d3.select(container)
.append('svg')
.attr('class', 'ac-scatter-svg')
.append('g');
this.values = [];
......@@ -27,8 +28,10 @@ export default class extends Chart {
render({
values,
callback,
}) {
this.values = typeof values === 'undefined' ? this.values : values;
this.callback = typeof callback === 'undefined' ? this.callback : callback;
const margin = {
top: 50,
......@@ -97,6 +100,19 @@ export default class extends Chart {
.attr('transform', `translate(${width}, 0)`)
.call(yAxisRight);
const brush = d3.brush()
.extent([[0, 0], [width, height]])
.on('end', () => {
if (!d3.event.sourceEvent) return;
const [[x0, y0], [x1, y1]] = d3.event.selection;
this.callback([[x.invert(x0), y.invert(y0)], [x.invert(x1), y.invert(y1)]]);
});
this.svg
.append('g')
.attr('class', 'ac-brush')
.call(brush);
const point = this.memory.selectAll('.ac-scatter-point')
.data(values);
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment