d3hackathon/visualize.js at master · Rudimental/d3hackathon · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
// var data = [];
// for (var i = 0; i < 100; i++) {
//   data.push(Math.random());
// }


var chicagoData = chicago.response.artists;

var chicago = d3.select(".chicago");

chicago
  .selectAll("div")
    .data(chicagoData)
  .enter().append("div")
    .style({
      "width" : function(d) { return d.hotttnesss * 100 + "%";},
      "margin" : "10px",
      "height" : "25px",
      "font-family" : "Helvetica Nueue,Helvetica,Sans-Sarif",
      "background-color" : "green",
      "padding-top" : "10px"
      })
    .text(function(d) { return d.name; });


var austinData = austin.response.artists;

var austin = d3.select(".austin");

austin
  .selectAll("div")
    .data(austinData)
  .append("div")
    .style({
      "width" : function(d) { return d.hotttnesss * 100 + "%";},
      "margin" : "10px",
      "height" : "25px",
      "font-family" : "Helvetica Nueue,Helvetica,Sans-Sarif",
      "background-color" : "blue",
      "padding-top" : "10px"
      })
    .text(function(d) { return d.name; });


//---------------
var san_franciscoData = sanfrancisco.response.artists;

var san_francisco = d3.select(".san_francisco");

san_francisco
  .selectAll("div")
    .data(san_franciscoData)
  .append("div")
    .style({
      "width" : function(d) { return d.hotttnesss * 100 + "%";},
      "margin" : "10px",
      "height" : "25px",
      "font-family" : "Helvetica Nueue,Helvetica,Sans-Sarif",
      "background-color" : "blue",
      "padding-top" : "10px"
      })
    .text(function(d) { return d.name; });

//---------------
var new_yorkData = newyork.response.artists;

var new_york = d3.select(".new_york");

new_york
  .selectAll("div")
    .data(new_yorkData)
  .append("div")
    .style({
      "width" : function(d) { return d.hotttnesss * 100 + "%";},
      "margin" : "10px",
      "height" : "25px",
      "font-family" : "Helvetica Nueue,Helvetica,Sans-Sarif",
      "background-color" : "blue",
      "padding-top" : "10px"
      })
    .text(function(d) { return d.name; });