d3js | oboejs test

Simple test using oboejs for 'loading JSON using streaming, combining the convenience of DOM with the speed and fluidity of SAX'.

Pulling in data fromthe guardian open platform api with filter for articles containing keyword/filter 'code'.

<!DOCTYPE html>
<meta charset='utf-8'>
<body>

var wrap = d3.select('#vis');
var ul = wrap.append('ul');
var details = wrap.append('p').classed('details', true);

// start downloading some data.
// every time we see a new thing in the data stream, use
// d3 to add an element to the visualisation
oboe('https://content.guardianapis.com/search?q=code%20&api-key=test')
    .node('results.*', function (data){

ul.append('li').append('a')
            .attr({
                class: 'item',
                href: function () { return data.webUrl; }
            })
            .html(function () { return '&#8702; ' + data.webTitle; } );

// no need to handle update or exit set here since
      // downloading is purely additive
    })
    .node({
        // detecting strings/numbers 
        'total': function (d) {
            details.html(function () { return 'total: ' + d  } );
        }
   });

</script>

</body>
</html>

https://d3js.org/d3.v3.min.js

https://cdnjs.cloudflare.com/ajax/libs/oboe.js/2.1.2/oboe-browser.min.js