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
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
|
<%
# This is the maximum number of tags in the tag cloud. Javascript code will only show
# as many of them as will fit in the window.
tagcloud_number_of_keys = 300
tagcloud_number_of_tags = 30
tagcloud_number_of_relations = 30
keys = @db.select("SELECT key, scale1 FROM popular_keys ORDER BY scale1 DESC LIMIT #{ tagcloud_number_of_keys }").
execute().
each_with_index{ |tag, idx| tag['pos'] = (tagcloud_number_of_keys - idx) / tagcloud_number_of_keys.to_f }
tags = @db.select("SELECT skey, svalue FROM top_tags WHERE skey NOT IN ('source', 'source_ref', 'attribution') ORDER BY count_all DESC LIMIT #{ tagcloud_number_of_tags }").execute()
relations = @db.select("SELECT rtype FROM db.relation_types ORDER BY count DESC LIMIT #{ tagcloud_number_of_relations }").execute()
%>
var keys_data = <%= keys.map{ |tag| { :text => tag['key'], :size => tagcloud_size(tag) } }.to_json.gsub(/\},/, "},\n") %>,
tags_data = <%= tags.map{ |entry| [ entry['skey'], entry['svalue'] ] }.to_json.gsub(/\],/, "],\n") %>,
relations_data = <%= relations.map{ |row| row['rtype'] }.to_json.gsub(/\],/, "],\n") %>,
width, height, font_family = 'Impact', font_weight = 'normal';
up = function() {};
function draw(words) {
var fill = d3.scale.category20b();
d3.select("div#tagcloud").append("svg")
.attr("width", width)
.attr("height", height)
.append("g")
.attr("transform", 'translate(' + width/2 + ',' + height/2 + ')')
.selectAll("text")
.data(words)
.enter()
.append('svg:a')
.attr('xlink:href', function(d) { return url_for_key(d.text); })
.append("text")
.style("font-size", function(d) { return d.size + "px"; })
.style("font-family", font_family)
.style("font-weight", font_weight)
.style('fill', function(d, i) { return d3.rgb(fill(i)).darker(0.5); })
.attr("text-anchor", "middle")
.attr("transform", function(d) {
return "translate(" + [d.x, d.y] + ")rotate(" + d.rotate + ")";
})
.text(function(d) { return d.text; });
}
function resize_home() {
var tagcloud = jQuery('#tagcloud');
tagcloud.empty();
tagcloud.height(0);
resize_box();
fill_lists();
height = tagcloud.parent().innerHeight();
tagcloud.parent().children().each(function(index) {
if (this.id != 'tagcloud') {
height -= jQuery(this).outerHeight(true);
}
});
height -= 50;
tagcloud.height(height);
width = tagcloud.parent().width();
d3.layout.cloud().size([width, height])
.words(keys_data)
.timeInterval(10)
.rotate(function() { return ~~(Math.random() * 5) * 30 - 60; })
.font(font_family)
.fontWeight(font_weight)
.fontSize(function(d) { return d.size; })
.on('end', draw)
.start();
}
function fill_lists() {
var key_list = jQuery('#key_list').empty(),
tag_list = jQuery('#tag_list').empty(),
relation_list = jQuery('#relation_list').empty(),
title_td_height = 42,
reserve_height = 64,
max_height = jQuery('table').height() / 3 - title_td_height - reserve_height;
i = 0;
while (key_list.outerHeight() < max_height && keys_data[i]) {
var d = keys_data[i];
key_list.append(link_to_key(d.text));
key_list.append(' • ');
i++;
}
key_list.append('...');
i = 0;
while (tag_list.outerHeight() < max_height && tags_data[i]) {
var d = tags_data[i];
tag_list.append(link_to_tag(d[0], d[1]));
tag_list.append(' • ');
i++;
}
tag_list.append('...');
i = 0;
while (relation_list.outerHeight() < max_height && relations_data[i]) {
var d = relations_data[i];
relation_list.append(link_to_rtype(d));
relation_list.append(' • ');
i++;
}
relation_list.append('...');
}
function page_init() {
jQuery(window).resize(resize_home);
resize_home();
}
|