Food and Maps

Food options in Austin TX

<meta charset="utf-8">
  <title>Senthil's Stencil</title>
  <meta name="description" content="">
  <meta name="Senthil Thyagarajan" content="">

<meta name="viewport" content="width=device-width, initial-scale=1">

<link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css">

<link rel="stylesheet" href="css/normalize.css">
  <link rel="stylesheet" href="css/skeleton.css">
  <link rel="stylesheet" href="css/bootstrap.css">

<link rel="icon" type="image/png" href="images/favicon.png">

</head>
<meta charset="utf-8">
<style>
text {
font: 10px sans-serif;
text-anchor: middle;
}

</style>
<body>

var svg = d3.select("svg"),
      width = +svg.attr("width");

var format = d3.format(",d");

var color = d3.scaleOrdinal(d3.schemeCategory10);

var pack = d3.pack()
      .size([width, width])
      .padding(1.5);

d3.csv("austin_fsq.csv", function(d) {
    d.sno = +d.sno;
    if (d.sno && d.rating>=9&&d.value < 500) return d;
  }, function(error, classes) {
    if (error) throw error;

var node = svg.selectAll(".node")
      .data(pack(root).leaves())
      .enter().append("g")
        .attr("class", "node")
        .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; });

node.append("circle")
        .attr("id", function(d) { return d.id; })
        .attr("r", function(d) { return d.r; })
        .style("fill", function(d) { return color(d.package); });

node.append("clipPath")
        .attr("id", function(d) { return "clip-" + d.id; })
      .append("use")
        .attr("xlink:href", function(d) { return "#" + d.id; });

node.append("text")
        .attr("clip-path", function(d) { return "url(#clip-" + d.id + ")"; })
      .selectAll("tspan")
      .data(function(d) { return d.class.split(/(?=[A-Z][^A-Z])/g); })
      .enter().append("tspan")
        .attr("x", 0)
        .attr("y", function(d, i, nodes) { return 13 + (i - nodes.length / 2 - 0.5) * 10; })
        .text(function(d) { return d; });

node.append("title")
    .text(function(d) { return d.data.id + "\n" + format(d.value); });
  });

</script>
 </div>
</html>

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