Commit 3119ebe7 authored by Sascha Herzinger's avatar Sascha Herzinger
Browse files

added whiskers

parent 767a2828
...@@ -12,18 +12,16 @@ ...@@ -12,18 +12,16 @@
} }
.ac-box-upper-whisker { .ac-box-upper-whisker {
stroke-width: 1px; stroke-width: 2px;
shape-rendering: crispedges; shape-rendering: crispedges;
} }
.ac-box-lower-whisker { .ac-box-lower-whisker {
stroke-width: 1px; stroke-width: 2px;
shape-rendering: crispedges; shape-rendering: crispedges;
} }
.ac-box-box { .ac-box-box {
fill: rgb(124, 191, 255);
stroke: none;
shape-rendering: crispedges; shape-rendering: crispedges;
cursor: pointer; cursor: pointer;
} }
......
...@@ -206,57 +206,63 @@ export default class extends Chart { ...@@ -206,57 +206,63 @@ export default class extends Chart {
line.exit() line.exit()
.remove(); .remove();
// const upperWhisker = this.svg.selectAll('.ac-box-upper-whisker')
// .data(data); const upperWhisker = this.svg.selectAll('.ac-box-upper-whisker')
// .data(data);
// upperWhisker.enter()
// .append('line') upperWhisker.enter()
// .attr('class', 'ac-box-upper-whisker') .append('line')
// .attr('x1', d => x(d.group) + x.bandwidth() / 3) .attr('class', 'ac-box-upper-whisker')
// .attr('y1', d => y(d.median)) .attr('stroke', d => color(d.group))
// .attr('x2', d => x(d.group) + x.bandwidth() - x.bandwidth() / 3) .attr('x1', d => x(d.group) + x.bandwidth() / 3)
// .attr('y2', d => y(d.median)) .attr('y1', d => y(d.median))
// .transition() .attr('x2', d => x(d.group) + x.bandwidth() - x.bandwidth() / 3)
// .duration(500) .attr('y2', d => y(d.median))
// .attr('y1', d => y(d.upperWhisker)) .transition()
// .attr('y2', d => y(d.upperWhisker)); .duration(500)
// .attr('y1', d => y(d.upperWhisker))
// upperWhisker .attr('y2', d => y(d.upperWhisker));
// .transition()
// .duration(500) upperWhisker
// .attr('x1', d => x(d.group) + x.bandwidth() / 3) .transition()
// .attr('y1', d => y(d.upperWhisker)) .duration(500)
// .attr('x2', d => x(d.group) + x.bandwidth() - x.bandwidth() / 3) .attr('stroke', d => color(d.group))
// .attr('y2', d => y(d.upperWhisker)); .attr('x1', d => x(d.group) + x.bandwidth() / 3)
// .attr('y1', d => y(d.upperWhisker))
// upperWhisker.exit() .attr('x2', d => x(d.group) + x.bandwidth() - x.bandwidth() / 3)
// .remove(); .attr('y2', d => y(d.upperWhisker));
//
// const lowerWhisker = this.svg.selectAll('.ac-box-lower-whisker') upperWhisker.exit()
// .data(data); .remove();
//
// lowerWhisker.enter() const lowerWhisker = this.svg.selectAll('.ac-box-lower-whisker')
// .append('line') .data(data);
// .attr('class', 'ac-box-lower-whisker')
// .attr('x1', d => x(d.group) + x.bandwidth() / 3) lowerWhisker.enter()
// .attr('y1', d => y(d.median)) .append('line')
// .attr('x2', d => x(d.group) + x.bandwidth() - x.bandwidth() / 3) .attr('class', 'ac-box-lower-whisker')
// .attr('y2', d => y(d.median)) .attr('stroke', d => color(d.group))
// .transition() .attr('x1', d => x(d.group) + x.bandwidth() / 3)
// .duration(500) .attr('y1', d => y(d.median))
// .attr('y1', d => y(d.lowerWhisker)) .attr('x2', d => x(d.group) + x.bandwidth() - x.bandwidth() / 3)
// .attr('y2', d => y(d.lowerWhisker)); .attr('y2', d => y(d.median))
// .transition()
// lowerWhisker .duration(500)
// .transition() .attr('y1', d => y(d.lowerWhisker))
// .duration(500) .attr('y2', d => y(d.lowerWhisker));
// .attr('x1', d => x(d.group) + x.bandwidth() / 3)
// .attr('y1', d => y(d.lowerWhisker)) lowerWhisker
// .attr('x2', d => x(d.group) + x.bandwidth() - x.bandwidth() / 3) .transition()
// .attr('y2', d => y(d.lowerWhisker)); .duration(500)
// .attr('stroke', d => color(d.group))
// lowerWhisker.exit() .attr('x1', d => x(d.group) + x.bandwidth() / 3)
// .remove(); .attr('y1', d => y(d.lowerWhisker))
.attr('x2', d => x(d.group) + x.bandwidth() - x.bandwidth() / 3)
.attr('y2', d => y(d.lowerWhisker));
lowerWhisker.exit()
.remove();
const median = this.svg.selectAll('.ac-box-median') const median = this.svg.selectAll('.ac-box-median')
.data(data); .data(data);
......
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