a work-in-progress d3 v4 fork of the bl.ock reusable updating exploding boxplot from @tennisvisuals

currently stuck in this strange limbo state where there are no errors in the Chrome devtools console, yet there is no visualization rendered on-screen.

I suspect that the missing piece has something to do with one of these three d3 API changes:

• the merge() lifecycle event –> docs

• the return value of selection.call() –> docs

• the argument order for d3.map().each() callbacks –> docs

click the Default Colors radio button, then open up the console to see the strange lack of errors for yourself 😅

If you figure out how to render vis with d3 v4 do tweet what you find at @micahstubbs 😄

---

Original README.md

---

reusable updating exploding boxplot

Design based on original: mcaule

See this block in production with Live Data

Features:

• Dynamic data transitions
• Events are configurable as options such that external functions can be seamlessly integrated
  • e.g. external tooltips can be configured for mouseover events

var container = d3.select('body');
var xbp = explodingBoxplot();
xbp.options({
  data: {
    group: 'Set Score',
    color_index: 'Set Score',
    identifier: 'h2h'
  },
  axes: {
    x: { label: 'Set Score' },
    y: { label: 'Total Points' }
  }
});
xbp.data(data);
container.call(xbp);
xbp.update();

Change the dimension for y axis:

xbp.options( { axes: { y: { label: 'Total Shots' } } });
xbp.update();

Data for this example was generated by mcpParse

Accessors:

by default accessors with no parameters return current values

• chart.options(object) // for options that don’t have accessors
• chart.width(width)
• chart.height(height)
• chart.data(data) // set data
• chart.update() // update chart
• chart.colors(object) // chart.colors({‘group’: ‘color1’, ‘group’: ‘color2’})
• chart.events() // trigger functions for i.e. mouseover/mouseout events

operations on data held in chart instance

• chart.pop()
• chart.push(row) -or- chart.push([row, row])