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
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
|
# File 'lib/mapkick/helper.rb', line 11
def mapkick_map(scope, data = {}, options = {})
@mapkick_map_id ||= 0
options = options.dup
element_id = options.delete(:id) || "map_#{@mapkick_map_id += 1}"
styles = options.delete(:styles) || "style='position: relative;'"
projection = options.delete(:projection) || "equirectangular"
fills = options.delete(:fills) || ['#fcc','#f99','#f66','#f33','#f00']
defaultFill = options.delete(:defaultFill) || "#ccc"
events = options.delete(:events) || []
geo_options = options.delete(:geo) || {}
= geo_options.delete(:popupTemplate) || "'<strong>' + geo.properties.name + '<br/><center>' + data.numberOfThings + '</center></strong>'"
geo_hideAntarctica = geo_options.delete(:hideAntarctica) || true
geo_borderWidth = geo_options.delete(:borderWidth) || 1
geo_borderColor = geo_options.delete(:borderColor) || '#FDFDFD'
geo_popoverOnHover = geo_options.delete(:popoverOnHover) || true
geo_highlightOnHover = geo_options.delete(:highlightOnHover) || true
geo_highlightFillColor = geo_options.delete(:highlightFillColor) || '#FC8D59'
geo_highlightBorderColor = geo_options.delete(:highlightBorderColor) || 'rgba(250, 15, 160, 0.2)'
geo_highlightBorderWidth = geo_options.delete(:highlightBorderWidth) || 2
bubbles = options.delete(:bubbles) || []
bubble_options = options.delete(:bubble) || {}
bubble_maxRadius = bubble_options.delete(:maxRadius) || 50
bubble_minRadius = bubble_options.delete(:minRadius) || 10
= bubble_options.delete(:popup) || "data.name"
bubble_borderWidth = bubble_options.delete(:borderWidth) || 2
bubble_borderColor = bubble_options.delete(:borderColor) || '#FFFFFF'
= bubble_options.delete(:popupOnHover) || true
bubble_fillOpacity = bubble_options.delete(:fillOpacity) || 0.75
bubble_highlightOnHover = bubble_options.delete(:highlightOnHover) || true
bubble_highlightFillColor = bubble_options.delete(:highlightFillColor) || '#FC8D59'
bubble_highlightBorderColor = bubble_options.delete(:highlightBorderColor) || 'rgba(250, 15, 160, 0.2)'
bubble_highlightBorderWidth = bubble_options.delete(:highlightBorderWidth) || 2
bubble_highlightFillOpacity = bubble_options.delete(:highlightFillOpacity) || 0.85
show_legend = options.delete(:show_legend) || false
js_fills = ["defaultFill: '#{defaultFill}'"]
if data.count > 0
fill_buckets = buckets(data, fills.count)
fills.each_with_index do |fill, i|
js_fills << "'#{fill_buckets[i]}': '#{fill}'"
end
end
state_data = []
data.each_pair do |key, val|
state_data << "#{key}: {fillKey: '#{fill_buckets[color(data, key, (0...fills.length).to_a)]}', numberOfThings: #{data[key]}}"
end
events.map! do |event|
"datamap.svg.selectAll('.datamaps-subunit').on('#{event[:type]}', function(geography) {
#{event[:event]}
})"
end
js_bubbles = bubbles.map do |bubble|
bubble[:radius] = bubble_radius(bubbles, bubble, bubble_minRadius, bubble_maxRadius)
bubble_data = []
bubble.each_pair do |key, val|
if [Fixnum, Float].include?(val.class)
bubble_data << "#{key}: #{val}"
else
bubble_data << "#{key}: '#{val}'"
end
end
"{#{bubble_data.join(',')}}"
end
html = " <div id=\"\#{element_id}\" \#{styles}></div>\n HTML\n\n js = <<-JS\n <script type=\"text/javascript\">\n $(function(){\n var map_\#{element_id} = new Datamap({\n element: document.getElementById(\"\#{element_id}\")\n , scope: '\#{scope}'\n , projection: '\#{projection}'\n , fills: {\#{js_fills.join(',')}}\n , data: {\n \#{state_data.join(',')}\n }\n , done: function(datamap) {\n \#{events.join(',')}\n }\n , geographyConfig: {\n popupTemplate: function(geo, data) {\n return ['<div class=\"hoverinfo\">', \#{geo_popupTemplate}, '</div>'].join('')\n }\n , hideAntarctica: \#{geo_hideAntarctica}\n , borderWidth: \#{geo_borderWidth}\n , borderColor: '\#{geo_borderColor}'\n , popupOnHover: \#{geo_popoverOnHover}\n , highlightOnHover: \#{geo_highlightOnHover}\n , highlightFillColor: '\#{geo_highlightFillColor}'\n , highlightBorderColor: '\#{geo_highlightBorderColor}'\n , highlightBorderWidth: \#{geo_highlightBorderWidth}\n }\n })\n\n var bubbles_\#{element_id} = [\#{js_bubbles.join(',')}]\n if (bubbles_\#{element_id}.length > 0) {\n map_\#{element_id}.bubbles(bubbles_\#{element_id}, {\n popupTemplate: function (geo, data) { \n return ['<div class=\"hoverinfo\">', \#{bubble_popup}, '</div>'].join('')\n }\n , borderWidth: \#{bubble_borderWidth}\n , borderColor: '\#{bubble_borderColor}'\n , popupOnHover: \#{bubble_popupOnHover}\n , fillOpacity: \#{bubble_fillOpacity}\n , highlightOnHover: \#{bubble_highlightOnHover}\n , highlightFillColor: '\#{bubble_highlightFillColor}'\n , highlightBorderColor: '\#{bubble_highlightBorderColor}'\n , highlightBorderWidth: \#{bubble_highlightBorderWidth}\n , highlightFillOpacity: \#{bubble_highlightFillOpacity}\n })\n }\n\n if (\#{show_legend}){\n map_\#{element_id}.legend()\n }\n })\n </script>\n JS\n\n if options[:content_for]\n content_for(options[:content_for]) { js.respond_to?(:html_safe) ? js.html_safe : js }\n else\n html += js\n end\n\n html.respond_to?(:html_safe) ? html.html_safe : html\nend\n"
|