Image Gallery

index.html

<script src="//d3js.org/d3.v3.js"></script>
<style>
body {
  background: #000;
  margin: 2px;
}
img {
  border-radius: 4px;
  padding: 2px;
}
</style>
<script>
d3.json("//www.reddit.com/r/earthporn.json?limit=80", function(error, imgs) {
  // filter out posts without a thumbnail
  var images = imgs.data.children.filter(function(d) {
    return d.data.thumbnail.slice(-3) == "jpg";
  });

  images.forEach(function(img) {
    d3.select("body")
      .append("a")
      .attr("href", img.data.url)
      .append("img")
      .attr({
        height: 66,
        src: img.data.thumbnail
      });
  });
});
</script>