Skip to content

Instantly share code, notes, and snippets.

@mostaphaRoudsari
Created July 17, 2017 12:48
Show Gist options
  • Select an option

  • Save mostaphaRoudsari/8852e998bf39196f5a5f949255e50ac5 to your computer and use it in GitHub Desktop.

Select an option

Save mostaphaRoudsari/8852e998bf39196f5a5f949255e50ac5 to your computer and use it in GitHub Desktop.

Revisions

  1. mostaphaRoudsari created this gist Jul 17, 2017.
    1 change: 1 addition & 0 deletions .block
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    license: mit
    1 change: 1 addition & 0 deletions README.md
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    Built with [blockbuilder.org](http://blockbuilder.org)
    23 changes: 23 additions & 0 deletions index.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,23 @@
    <!DOCTYPE html>

    <head>
    <title>d3js workshop - data binding</title>
    <script src="http://d3js.org/d3.v3.js"></script> <!-- import D3 library -->
    </head>

    <body>
    <script type="text/javascript">
    // Write your code here
    // an empty selection - looking for instantiations of data
    div = d3.selectAll('div')
    .data(['ben', 'elcin', 'ana', 'jonatan']) // data - it will be bound to the selection in next line!
    .enter() // bound data to selection for every time that there is a data but there is no element
    // .append('div') // append a div element to each selection
    // .text("hello world!"); // fill each element with text - but what was the use of data! comment this line and uncomment next line to really use the data.

    // div.text(function(d){
    // return d;
    // }); // let's really use the data to fill each element

    </script>
    </body>