Skip to content

Instantly share code, notes, and snippets.

/jsbin.ruwufiwe.css

Created June 7, 2014 12:53
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save anonymous/ad787a0018f4aed98d2e to your computer and use it in GitHub Desktop.
Save anonymous/ad787a0018f4aed98d2e to your computer and use it in GitHub Desktop.
Download ZIP
Raw
jsbin.ruwufiwe.css
#test{
outline: 1px solid red;
}
Raw
jsbin.ruwufiwe.html
<!DOCTYPE html>
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<svg id="test">
</body>
</html>
Raw
jsbin.ruwufiwe.js
var _data = [
{123:12341},
{321:21424},
{643:156742},
{1232:2677243},
{132:39491}
];
var parent = d3.select('#test');
parent
.attr({
width: 400,
height: 400
});
parent
.append('circle')
.attr({
cx: 200,
cy: 200,
r: 150,
stroke:'blue',
'stroke-width':1,
fill:'none'
});
var circularScale = d3.scale.linear().domain([0,_data.length]).range([0,2*Math.PI]);
parent
.append('g')
.attr('class','data')
.selectAll('circle')
.data(_data)
.enter()
.append('circle')
.attr({
cx: function(d,i){
console.log(i,circularScale(i));
return 200+ 150 * Math.cos(circularScale(i));
},
cy: function(d,i){
return 200+ 150 * Math.sin(circularScale(i));
},
r: 10,
stroke:'green',
'stroke-width':1,
fill:'none'
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment