index.html
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
body, html{
width: 960px;
height: 500px;
margin: 0;
}
.axis{
fill: none;
stroke: black;
}
.axis text{
fill: white;
stroke: none;
}
.axis circle{
fill: gray;
stroke: none;
}
</style>
</head>
<body>
<script src="//d3js.org/d3.v3.js" charset="utf-8"></script>
<script>
var w = window.innerWidth, h = window.innerHeight
var m = 100
var svg = d3.select('body').append('svg')
.attr({width: w, height: h})
var x = d3.scale.linear().domain([0, w]).range([m, w - m])
var axis = d3.svg.axis().scale(x)
svg.append('g').attr('class', 'axis').call(axis)
.attr('transform', 'translate(' + [0, m] + ')')
svg.select('.axis').selectAll('g.tick')
.insert('circle', ':first-child').attr('r', 25).attr('cy', 15)
</script>
</body>
</html>