Skip to content

Instantly share code, notes, and snippets.



Last active Aug 29, 2015
What would you like to do?
Not Just SVG

This sample application is a live-demo component of a blog post I wrote for Art & Logic, Inc..

<meta http-equiv="content-type" content="text/html;charset=UTF-8">
<title>Not Just SVG</title>
<style type="text/css">
table {
width: 50%;
margin: 0 auto;
td {
font-size: xx-large;
text-align: center;
<script src="//" charset="utf-8"></script>
/* create a table from raw data */
"use strict";
// our data, a 3x10 matrix
var matrix = [d3.range(1,11),
d3.range(11, 21),
// append a table to the body
var table ='body')
// select all tr's (there are none)
.data(matrix) // bind the whole matrix, creating an update selection
.enter() // the enter selection, three, one for each row
.append('tr') // create a tr
.selectAll('td') // select all td's (there are none)
// bind each row's data, creating an update selection
.data(function(d, i) {console.log('row ' + i + ':', d);return d;})
.enter() // the enter selection for a cell, ten, one for each cell
.append('td') // append the cell
.text(function(d) {return d;}); // set the text to the cell value
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment