Initial work on extensible line-bar chart

[timhall]

Key points:

• Container is used to place charts (with chartBase) so that individual charts don't have to worry about padding/margins and can instead be full-width and full-height and placed by Container
• Container stores raw data and handles redraws when any dimensions change
• Shared data manipulation and scaling is handled in XYBase and CenteredValueBase so that each chart gets a common data format and scales. Additionally, this data is first transformed in the Container so that a common transformation can be applied.
• property helper is used to define chainable getters/setters for charts
• dimensions helper is used to robustly determine width and height of given chart

Hierarchy:

Base (width, height, data)
|_ Container (rawData, chartBase, bounds)
   |_ LineBarChart (includes BarChart and CenteredLineChartWithLabels)
|_ XYBase (x, y, scales)
   |_ ValueBase (updates x, y for values)
      |_ CenteredValueBase (itemWidth, itemPadding)
         |_ BarChart
         |_ CenteredLineChart
         |_ CenteredDataLabelsChart
         |_ CenteredLineChartWithLabels (includes CenteredLineChart and CenteredDataLabelsChart)

[timhall]

@john-clarke I think this is ready to merge to kickoff the iteration process on a smaller level

Recommendation: Can we rename the repo to d3.chart.csnw.configurable? I think it fits better with the larger goal of creating a chart from configuration and line-bar is a little limiting.

Key points:

• Add mixin() extension to allow for multiple prototypal inheritance
• Add build system for dividing up logical components
• Firm up hierarchy
• Add series support with seriesLayer extension
• Initial Line, Bars, Axis, and Legend implementations

Updated Hierarchy:

Base (width, height, data)
|_ Container (rawData, chartBase, chartMargins, attachChart, attachComponent)
   |_ ConfigurableChart (attaches components and charts by options)
|_ Component (positioning)
   |_ Axis
   |_ Legend
|_ Chart (x, y, scales)
   |_ Labels (labels)
   |_ ChartWithLabels (chart with labels attached)
      |_ Bars
      |_ Line
      |_ LineValues

Example Usage:

var chart1 = d3.select('#chart_1')
  .append('svg')
  .chart('Configurable', {
    charts: [
      {
        type: 'Bars', 
        dataKey: 'peopleParticipating', 
        yScale: {domain: [0, 20000]}, 
        labelFontSize: 14,
        labelOffset: 10,
        labelPosition: 'top|bottom' // (top if positive or 0, bottom if negative)
      },
      {
        type: 'LineValues', 
        dataKey: 'deathsPrevented', 
        yScale: {domain: [0, 70]}, 
        labelPosition: 'top'
      }
    ],
    axes: [
      {
        type: 'AxisValues',
        dataKey: 'peopleParticipating',
        axisPosition: 'bottom'
      },
      {
        type: 'AxisValues',
        dataKey: 'peopleParticipating',
        axisPosition: 'left'
      },
      {
        type: 'AxisValues',
        dataKey: 'deathsPrevented',
        axisPosition: 'right'
      }
    ],
    legend: {
      type: 'InsetLegend',
      legendPosition: {x: 10, y: 0}
    }
  })
  .width(600)
  .height(400)
  .chartMargins({top: 10});

[john-clarke]

Looks great, Tim. I've made the name change as requested.

• We need a way to implement and test client-specific examples (perhaps in another repo?). In the ends we'll want to test these charts within the PMSR framework (perhaps in a new branch). Let's discuss the options.
• We also need to remove reference to CRC etc. from the generic examples that will (one day) be made public.
• At some point you demonstrated the ability to add series multiple bar series. Could you re-add that example? Ideally, perhaps a second chart with 2 line series and 2 bar series. Perhaps we should expand the example directory to include 1 index file for each example and perhaps a single index that loads (dynamically) all the single chart examples?