source: Dev/branches/jQueryUI/client/d3/examples/cartogram/cartogram.js @ 249

Last change on this file since 249 was 249, checked in by hendrikvanantwerpen, 13 years ago

This one's for Subversion, because it's so close...

First widget (stripped down sequencer).
Seperated client and server code in two direcotry trees.

File size: 1.5 KB
Line 
1// Ratio of Obese (BMI >= 30) in U.S. Adults, CDC 2008
2var data = [
3  , .187, .198, , .133, .175, .151, , .1, .125, .171, , .172, .133, , .108,
4  .142, .167, .201, .175, .159, .169, .177, .141, .163, .117, .182, .153, .195,
5  .189, .134, .163, .133, .151, .145, .13, .139, .169, .164, .175, .135, .152,
6  .169, , .132, .167, .139, .184, .159, .14, .146, .157, , .139, .183, .16, .143
7];
8
9var svg = d3.select("#chart")
10  .append("svg:svg");
11
12d3.json("../data/us-states.json", function(json) {
13  var path = d3.geo.path();
14
15  // A thick black stroke for the exterior.
16  svg.append("svg:g")
17      .attr("class", "black")
18    .selectAll("path")
19      .data(json.features)
20    .enter().append("svg:path")
21      .attr("d", path);
22
23  // A white overlay to hide interior black strokes.
24  svg.append("svg:g")
25      .attr("class", "white")
26    .selectAll("path")
27      .data(json.features)
28    .enter().append("svg:path")
29      .attr("d", path);
30
31  // The polygons, scaled!
32  svg.append("svg:g")
33      .attr("class", "grey")
34    .selectAll("path")
35      .data(json.features)
36    .enter().append("svg:path")
37      .attr("transform", function(d) {
38        var centroid = path.centroid(d),
39            x = centroid[0],
40            y = centroid[1];
41        return "translate(" + x + "," + y + ")"
42            + "scale(" + Math.sqrt(data[+d.id] * 5 || 0) + ")"
43            + "translate(" + -x + "," + -y + ")";
44      })
45      .style("stroke-width", function(d) {
46        return 1 / Math.sqrt(data[+d.id] * 5);
47      })
48      .attr("d", path);
49
50});
Note: See TracBrowser for help on using the repository browser.