Forked from Captain Anonymous's Pen oXpoev.
Forked from Captain Anonymous's Pen oXpoev.
A Pen by Shelby Sturgis on CodePen.
Forked from Captain Anonymous's Pen oXpoev.
Forked from Captain Anonymous's Pen oXpoev.
A Pen by Shelby Sturgis on CodePen.
If you haven't already set your NPM author info, now you should:
npm set init.author.name "Your Name"
npm set init.author.email "[email protected]"
npm set init.author.url "http://yourblog.com"
npm adduser
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title></title> | |
| <style> | |
| body { | |
| font: 10px sans-serif; | |
| } | |
| define(function (require) { | |
| var d3 = require("d3"); | |
| return function split() { | |
| var splitBy = function (d) { return d; }; | |
| var element = "div"; | |
| var elementClass = function () { return "horizontal"; }; | |
| var predicate = false; | |
| function layout(selection) { |
| <div class="visualize"></div> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js" charset="utf-8"></script> |
| country | median_age | gdp | edu_index | |
|---|---|---|---|---|
| Afghanistan | 18 | 18949 | 0.354 | |
| Albania | 30.2 | 13000 | 0.886 | |
| Algeria | 27.1 | 198735 | 0.748 | |
| Andorra | 39.9 | 3577 | 0.878 | |
| Antigua and Barbuda | 30 | 1118 | 0.945 | |
| Argentina | 30.3 | 448165 | 0.946 | |
| Australia | 37.5 | 1515468 | 0.993 | |
| Austria | 42.6 | 418031 | 0.962 | |
| Azerbaijan | 28.5 | 63404 | 0.881 |
| Afghanistan | 18 | 18949 | 0.354 | |
|---|---|---|---|---|
| Albania | 30.2 | 13000 | 0.886 | |
| Algeria | 27.1 | 198735 | 0.748 | |
| Andorra | 39.9 | 3577 | 0.878 | |
| Antigua and Barbuda | 30 | 1118 | 0.945 | |
| Argentina | 30.3 | 448165 | 0.946 | |
| Australia | 37.5 | 1515468 | 0.993 | |
| Austria | 42.6 | 418031 | 0.962 | |
| Azerbaijan | 28.5 | 63404 | 0.881 |
| // D3 code | |
| var $el = $('.visualize-chart')[0]; | |
| var data = { | |
| type: 'chart', | |
| series: [{}, {}, {}] | |
| }; | |
| var selection = d3.select($el).datum(data).call(split); | |
| function split (selection) { | |
| selection.each(function (data) { |
| // Pulling values recursively from Pie Chart Data | |
| function getSize (obj) { | |
| return obj.size; | |
| } | |
| function isZero (d) { | |
| return d.size === 0; | |
| } |