Skip to content

Instantly share code, notes, and snippets.

@bewest
Last active August 29, 2015 14:03
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save bewest/c209e405f1e9fd7ecbec to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<meta charset="utf-8">
<body bgcolor="#000000"">
<script src="http://d3js.org/d3.v3.min.js"></script>
<div id="chart"></div>
<script type="text/javascript">
//https://gist.github.com/NelsonMinar/3589712
var insulin = Math.max(0,Math.min(20,Math.random()*14-2)),
carbs = Math.max(0,Math.min(100,Math.random()*70-10)),
CR = Math.random()+5.5,
Scale = 3;
var R1 = Math.sqrt(Math.min(carbs,insulin*CR))/Scale,
R2 = Math.sqrt(Math.max(carbs,insulin*CR))/Scale,
R3 =R2 + 8/Scale;
var arc_data = [
{'element': '', 'color': '#9c4333', 'start': -1.5708, 'end': 1.5708, 'inner': 0, 'outer': R1},
{'element': '', 'color': '#d4897b', 'start': -1.5708, 'end': 1.5708, 'inner': R1, 'outer': R2},
{'element': '', 'color': '#000000', 'start': -1.5708, 'end': 1.5708, 'inner': R2, 'outer': R3},
{'element': '', 'color': '#3d53b7', 'start': 1.5708, 'end': 4.7124, 'inner': 0, 'outer': R1},
{'element': '', 'color': '#5d72c9', 'start': 1.5708, 'end': 4.7124, 'inner': R1, 'outer': R2},
{'element': '', 'color': '#000000', 'start': 1.5708, 'end': 4.7124, 'inner': R2, 'outer': R3},
];
var width = 200/Scale,
height = 200/Scale;
if (carbs < insulin * CR) arc_data[1].color = "#000000";//"#FFFFFF";
if (carbs > insulin * CR) arc_data[4].color = "#000000";//"#FFFFFF";
if (carbs > 0) arc_data[2].element = Math.round(carbs) + " g";
if (insulin > 0) arc_data[5].element = Math.round(insulin*10)/10 + " U";
var pie = d3.layout.pie().sort(null);
var arc = d3.svg.arc()
.innerRadius(function(d){return 5*d.inner;})
.outerRadius(function(d){return 5*d.outer;})
.endAngle(function(d){return d.start;})
.startAngle(function(d){return d.end;});
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height)
.selectAll("g")
.data(arc_data)
.enter()
.append("g")
.attr("transform", "translate(" + 100/Scale + ", " + 100/Scale +")");
var arcs = svg.append("path")
.attr("fill", function(d,i) {return d.color;})
.attr("id", function(d,i){return "s"+i;})
.attr("d",arc);
var label = svg.append("g")
.attr("id","label")
.style("fill","white");
label.append("text")
.style("font-size",30/Scale)
.style("font-family", "Arial")
.attr("text-anchor", "middle")
.attr("dy", ".35em")
.attr("transform", function(d) {
d.outerRadius = d.outerRadius * 2.1; // Set Outer Coordinate
d.innerRadius = d.outerRadius * 2.1; // Set Inner Coordinate
return "translate(" + arc.centroid(d) + ")";
})
.text(function(d){return d.element;})
</script>
@bewest
Copy link
Author

bewest commented Jul 14, 2014

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment