D3Example class

D3Example.js.coffee

class D3Example
  constructor: (@selector, width, height, @margin, hasBorder) ->
    @margin = top: 20, right: 20, bottom: 20, left: 20 unless @margin
    @el = @defineRootElement(@selector, +width, +height, @margin, hasBorder)

  defineRootElement: (selector, width, height, margin, hasBorder) =>
    @width = width - margin.left - margin.right
    @height = height - margin.top - margin.bottom

    d3.select(selector)
      .append('svg')
      .attr
        width: width
        height: height
      .append('g')
      .attr
        transform: "translate(#{margin.left},#{margin.top})"
        id: 'margin-convention'

    if hasBorder
      d3.select(selector)
        .select('svg')
        .insert('rect', ':first-child')
        .attr
          width: width
          height: height
          fill: 'none'
          stroke: '#bbb'
          'stroke-width': 1