Food options in Austin TX
xxxxxxxxxx<html><head> <!-- Basic Page Needs –––––––––––––––––––––––––––––––––––––––––––––––––– --> <meta charset="utf-8"> <title>Senthil's Stencil</title> <meta name="description" content=""> <meta name="Senthil Thyagarajan" content=""> <!-- Mobile Specific Metas –––––––––––––––––––––––––––––––––––––––––––––––––– --> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- FONT –––––––––––––––––––––––––––––––––––––––––––––––––– --> <link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css"> <!-- CSS –––––––––––––––––––––––––––––––––––––––––––––––––– --> <link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/skeleton.css"> <link rel="stylesheet" href="css/bootstrap.css"> <!-- Favicon –––––––––––––––––––––––––––––––––––––––––––––––––– --> <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><div class="container"> <svg width="1250" height="1080"></svg> <script src="https://d3js.org/d3.v4.min.js"></script> <script> 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 root = d3.hierarchy({children: classes}) .sum(function(d) { return d.value; }) .each(function(d) { if (id = d.data.id) { var id, i = id.lastIndexOf("."); d.id = id; d.package = id.slice(0, i); d.class = id.slice(i + 1); } }); 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