Enter, Update, Exit

    var data = [10];
    var width = 500;
    var height = 500;
    var canvas = d3.select("body")
                  .append("svg")
                  .attr("width", width)
                  .attr("height", height);

    // Enter example. (more data elements than existing circle elements)
    // DOM elements < data elements (enter)
    // at this point there's no dom elements for circle yet.
    var circle = canvas.selectAll("circle")
                  // bind empty selections to data
                  .data(data)
                  //
                  .enter()
                    // append a circle to each data element
                    .append("circle")
                    .attr("cx", 50)
                    .attr("cy", 50)
                    .attr("r", 25);