chart_js 1.0.1pre → 1.1.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +5 -5
- data/README.md +1 -3
- data/chart_js.gemspec +5 -4
- data/examples/bar_chart_2.rb +14 -0
- data/examples/bar_chart_event_stream.rb +35 -0
- data/examples/doughnut_chart.rb +33 -0
- data/examples/line_chart_2.rb +14 -0
- data/examples/line_chart_event_stream.rb +46 -0
- data/examples/pie_chart.rb +21 -0
- data/examples/radar_chart_2.rb +14 -0
- data/examples/wifi_signal_chart.rb +39 -0
- data/lib/chart_js.rb +74 -7
- data/lib/chart_js/chart/bar_chart/bar_chart.rb +3 -3
- data/lib/chart_js/chart/chart.rb +45 -17
- data/lib/chart_js/chart/data.rb +31 -7
- data/lib/chart_js/chart/dataset.rb +1 -1
- data/lib/chart_js/chart/dataset/line.rb +25 -0
- data/lib/chart_js/chart/event_stream.rb +68 -0
- data/lib/chart_js/chart/event_streams/event_streams.rb +11 -0
- data/lib/chart_js/chart/event_streams/push.rb +80 -0
- data/lib/chart_js/chart/helpers/dates.rb +54 -0
- data/lib/chart_js/chart/line_chart/line_chart.rb +3 -3
- data/lib/chart_js/chart/opts.rb +11 -4
- data/lib/chart_js/chart/radar_chart/radar_chart.rb +4 -4
- data/lib/chart_js/version.rb +1 -1
- metadata +36 -15
- data/.travis.yml +0 -5
- data/bin/console +0 -14
- data/bin/setup +0 -8
- data/lib/chart_js/chart/charts.rb +0 -22
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
|
-
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
2
|
+
SHA256:
|
3
|
+
metadata.gz: e954b9160710621bd2ab2e31e6b331bd3a91d5b51034aa34067d64cc1fd505f7
|
4
|
+
data.tar.gz: 62d724692b5cc246de04e93077cc1d913a0897d3aa3a8409c2204d28066b059b
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 63eeb922760959d2211eaefbb3afb6734d2df3796fd92cb51d92ae341f1ad899886ea950f23c03ed55c19904dbaafa8bbd29b4c6d4f1f133f13a779070dd5745
|
7
|
+
data.tar.gz: a659fa4048fe4169464055f8d242b6045812035fce1631bf2fffd4becc9c607c1cf5cbfef5c6f81b3e8e47773cec8e77b23f9c96edd5ece78680476dc04b0927
|
data/README.md
CHANGED
data/chart_js.gemspec
CHANGED
@@ -17,11 +17,12 @@ Gem::Specification.new do |spec|
|
|
17
17
|
spec.files = `git ls-files -z`.split("\x0").reject do |f|
|
18
18
|
f.match(%r{^(test|spec|features)/})
|
19
19
|
end
|
20
|
-
spec.bindir = "exe"
|
21
|
-
spec.executables = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
|
20
|
+
# spec.bindir = "exe"
|
21
|
+
# spec.executables = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
|
22
22
|
spec.require_paths = ["lib"]
|
23
23
|
|
24
|
-
spec.add_development_dependency "bundler", "~> 1
|
25
|
-
spec.add_development_dependency "rake", "~>
|
24
|
+
spec.add_development_dependency "bundler", "~> 2.1"
|
25
|
+
spec.add_development_dependency "rake", "~> 13.0"
|
26
26
|
spec.add_development_dependency "rspec", "~> 3.0"
|
27
|
+
spec.add_development_dependency "pry", "~> 0.12"
|
27
28
|
end
|
@@ -0,0 +1,14 @@
|
|
1
|
+
# path setting magic for example directory only
|
2
|
+
$LOAD_PATH.unshift File.expand_path('../../lib', __FILE__)
|
3
|
+
require "chart_js"
|
4
|
+
|
5
|
+
ChartJS.bar do
|
6
|
+
file "example.html"
|
7
|
+
data do
|
8
|
+
labels ["a", "b", "c"]
|
9
|
+
dataset "Example" do
|
10
|
+
color :random
|
11
|
+
data [1, 2, 3]
|
12
|
+
end
|
13
|
+
end
|
14
|
+
end
|
@@ -0,0 +1,35 @@
|
|
1
|
+
# path setting magic for example directory only
|
2
|
+
$LOAD_PATH.unshift File.expand_path('../../lib', __FILE__)
|
3
|
+
require "chart_js"
|
4
|
+
require "willow_run"
|
5
|
+
require "sinatra"
|
6
|
+
|
7
|
+
set :bind, '0.0.0.0'
|
8
|
+
set :port, 3141
|
9
|
+
|
10
|
+
get "/update_source", provides: 'text/event-stream' do
|
11
|
+
stream(:keep_open) do |out|
|
12
|
+
loop do
|
13
|
+
out << ChartJS.data do
|
14
|
+
{ label: Time.now.strftime("%r"), value: WillowRun::Status.new.getinfo.agrctlrssi }
|
15
|
+
end
|
16
|
+
sleep 2
|
17
|
+
end
|
18
|
+
end
|
19
|
+
end
|
20
|
+
|
21
|
+
get "/" do
|
22
|
+
chart = ChartJS.bar do
|
23
|
+
data do
|
24
|
+
labels Array.new
|
25
|
+
dataset WillowRun::Status.new.getinfo.ssid do
|
26
|
+
color :random
|
27
|
+
data Array.new
|
28
|
+
end
|
29
|
+
end
|
30
|
+
event_stream "/update_source" do
|
31
|
+
push
|
32
|
+
end
|
33
|
+
end
|
34
|
+
chart.to_html
|
35
|
+
end
|
@@ -0,0 +1,33 @@
|
|
1
|
+
## path setting magic for example directory only
|
2
|
+
$LOAD_PATH.unshift File.expand_path('../../lib', __FILE__)
|
3
|
+
require "chart_js"
|
4
|
+
ChartJS.doughnut do
|
5
|
+
file "example.html"
|
6
|
+
data do
|
7
|
+
dataset "a" do
|
8
|
+
color :random
|
9
|
+
data 1
|
10
|
+
end
|
11
|
+
dataset "b" do
|
12
|
+
color :random
|
13
|
+
data 2
|
14
|
+
end
|
15
|
+
dataset "c" do
|
16
|
+
color :random
|
17
|
+
data 3
|
18
|
+
end
|
19
|
+
end
|
20
|
+
end
|
21
|
+
#ChartJS.doughnut do
|
22
|
+
# file "example.html"
|
23
|
+
# data do
|
24
|
+
# dataset "Good" do
|
25
|
+
# color "#5cb85c"
|
26
|
+
# data 20
|
27
|
+
# end
|
28
|
+
# dataset "Bad" do
|
29
|
+
# color "#d9534f"
|
30
|
+
# data 4
|
31
|
+
# end
|
32
|
+
# end
|
33
|
+
#end
|
@@ -0,0 +1,14 @@
|
|
1
|
+
# path setting magic for example directory only
|
2
|
+
$LOAD_PATH.unshift File.expand_path('../../lib', __FILE__)
|
3
|
+
require "chart_js"
|
4
|
+
|
5
|
+
ChartJS.line do
|
6
|
+
file "example.html"
|
7
|
+
data do
|
8
|
+
labels ["a", "b", "c"]
|
9
|
+
dataset "Example" do
|
10
|
+
color :random
|
11
|
+
data [1, 2, 3]
|
12
|
+
end
|
13
|
+
end
|
14
|
+
end
|
@@ -0,0 +1,46 @@
|
|
1
|
+
# path setting magic for example directory only
|
2
|
+
$LOAD_PATH.unshift File.expand_path('../../lib', __FILE__)
|
3
|
+
require "chart_js"
|
4
|
+
require "willow_run"
|
5
|
+
require "sinatra"
|
6
|
+
|
7
|
+
set :bind, '0.0.0.0'
|
8
|
+
set :port, 3141
|
9
|
+
|
10
|
+
get "/update_source", provides: 'text/event-stream' do
|
11
|
+
stream(:keep_open) do |out|
|
12
|
+
loop do
|
13
|
+
out << ChartJS.data do
|
14
|
+
{ label: Time.now.strftime("%r"),
|
15
|
+
value: WillowRun::Status.new.getinfo.agrctlrssi
|
16
|
+
color: "##{SecureRandom.hex(6)}"
|
17
|
+
}
|
18
|
+
end
|
19
|
+
sleep 5
|
20
|
+
end
|
21
|
+
end
|
22
|
+
end
|
23
|
+
|
24
|
+
get "/" do
|
25
|
+
chart = ChartJS.build do
|
26
|
+
type "line"
|
27
|
+
data do
|
28
|
+
labels Array.new
|
29
|
+
dataset WillowRun::Status.new.getinfo.ssid do
|
30
|
+
color Array.new
|
31
|
+
data Array.new
|
32
|
+
point do
|
33
|
+
radius 0
|
34
|
+
hit_radius 3
|
35
|
+
end
|
36
|
+
line do
|
37
|
+
tension :false
|
38
|
+
end
|
39
|
+
end
|
40
|
+
end
|
41
|
+
event_stream "/update_source" do
|
42
|
+
push
|
43
|
+
end
|
44
|
+
end
|
45
|
+
chart.to_html
|
46
|
+
end
|
@@ -0,0 +1,21 @@
|
|
1
|
+
# path setting magic for example directory only
|
2
|
+
$LOAD_PATH.unshift File.expand_path('../../lib', __FILE__)
|
3
|
+
require "chart_js"
|
4
|
+
|
5
|
+
ChartJS.pie do
|
6
|
+
file "example.html"
|
7
|
+
data do
|
8
|
+
dataset "a" do
|
9
|
+
color :random
|
10
|
+
data 1
|
11
|
+
end
|
12
|
+
dataset "b" do
|
13
|
+
color :random
|
14
|
+
data 2
|
15
|
+
end
|
16
|
+
dataset "c" do
|
17
|
+
color :random
|
18
|
+
data 3
|
19
|
+
end
|
20
|
+
end
|
21
|
+
end
|
@@ -0,0 +1,14 @@
|
|
1
|
+
# path setting magic for example directory only
|
2
|
+
$LOAD_PATH.unshift File.expand_path('../../lib', __FILE__)
|
3
|
+
require "chart_js"
|
4
|
+
|
5
|
+
ChartJS.radar do
|
6
|
+
file "example.html"
|
7
|
+
data do
|
8
|
+
labels ["a", "b", "c"]
|
9
|
+
dataset "Example" do
|
10
|
+
color :random
|
11
|
+
data [1, 2, 3]
|
12
|
+
end
|
13
|
+
end
|
14
|
+
end
|
@@ -0,0 +1,39 @@
|
|
1
|
+
# path setting magic for example directory only
|
2
|
+
$LOAD_PATH.unshift File.expand_path('../../lib', __FILE__)
|
3
|
+
require "chart_js"
|
4
|
+
require "willow_run"
|
5
|
+
require "sinatra"
|
6
|
+
|
7
|
+
get "/update_source", provides: 'text/event-stream' do
|
8
|
+
stream(:keep_open) do |out|
|
9
|
+
loop do
|
10
|
+
out << ChartJS.data do
|
11
|
+
{ label: Time.now.strftime("%r"), data: WillowRun::Status.new.getinfo.agrctlrssi }
|
12
|
+
end
|
13
|
+
sleep 2
|
14
|
+
end
|
15
|
+
end
|
16
|
+
end
|
17
|
+
|
18
|
+
get "/" do
|
19
|
+
chart = ChartJS.line do
|
20
|
+
data do
|
21
|
+
labels Array.new
|
22
|
+
dataset WillowRun::Status.new.getinfo.ssid do
|
23
|
+
color :random
|
24
|
+
data Array.new
|
25
|
+
point do
|
26
|
+
radius 0
|
27
|
+
hit_radius 2
|
28
|
+
end
|
29
|
+
line do
|
30
|
+
tension :false
|
31
|
+
end
|
32
|
+
end
|
33
|
+
end
|
34
|
+
event_stream "/update_source" do
|
35
|
+
push
|
36
|
+
end
|
37
|
+
end
|
38
|
+
chart.to_html
|
39
|
+
end
|
data/lib/chart_js.rb
CHANGED
@@ -1,21 +1,88 @@
|
|
1
|
+
# coding: utf-8
|
2
|
+
# This file is part of ChartJS
|
3
|
+
# See https://github.com/picatz/chart_js for more information.
|
4
|
+
# Copyright (C) 2017 Kent 'picat' Gruber
|
5
|
+
# This program is published under MIT license.
|
6
|
+
|
1
7
|
require "chart_js/version"
|
2
8
|
require "chart_js/chart/chart"
|
3
|
-
require "chart_js/chart/charts"
|
4
9
|
|
10
|
+
# Chart JS is a simple yet flexible JavaScript charting library. This
|
11
|
+
# gem is a Ruby Domain Specific Language which allows you to easily
|
12
|
+
# build charts without touching a single line of JavaScript or HTML.
|
13
|
+
# @author Kent 'picat' Gruber
|
5
14
|
module ChartJS
|
15
|
+
# NOTE: I did not write every word of this inline documentation and credit
|
16
|
+
# much of it to to people over at http://www.chartjs.org/
|
17
|
+
|
18
|
+
# Build a chart, do some stuff!
|
6
19
|
def self.build(&block)
|
7
20
|
Chart.new(&block)
|
8
21
|
end
|
9
|
-
|
22
|
+
|
23
|
+
# A line chart is a way of plotting data points on a line. Often,
|
24
|
+
# it is used to show trend data, or the comparison of two data sets.
|
10
25
|
def self.line(&block)
|
11
|
-
|
26
|
+
chart = Chart.new
|
27
|
+
chart.type('line')
|
28
|
+
chart.build(&block)
|
12
29
|
end
|
13
30
|
|
31
|
+
# A radar chart is a way of showing multiple data points and
|
32
|
+
# the variation between them. They are often useful for
|
33
|
+
# comparing the points of two or more different data sets.
|
14
34
|
def self.radar(&block)
|
15
|
-
|
35
|
+
chart = Chart.new
|
36
|
+
chart.type('radar')
|
37
|
+
chart.build(&block)
|
38
|
+
end
|
39
|
+
|
40
|
+
# Pie charts are probably one of the most commonly used charts.
|
41
|
+
# They are divided into segments, the arc of each segment
|
42
|
+
# shows the proportional value of each piece of data. They are
|
43
|
+
# excellent at showing the relational proportions between data.
|
44
|
+
def self.pie(&block)
|
45
|
+
chart = Chart.new
|
46
|
+
chart.type('pie')
|
47
|
+
chart.build(&block)
|
16
48
|
end
|
17
|
-
|
18
|
-
|
19
|
-
|
49
|
+
|
50
|
+
# Doughnut charts are probably one of the most commonly used charts.
|
51
|
+
# They are divided into segments, the arc of each segment
|
52
|
+
# shows the proportional value of each piece of data. They are
|
53
|
+
# excellent at showing the relational proportions between data but
|
54
|
+
# with a big'O hole in the middle.
|
55
|
+
def self.doughnut(&block)
|
56
|
+
chart = Chart.new
|
57
|
+
chart.type('doughnut')
|
58
|
+
chart.build(&block)
|
59
|
+
end
|
60
|
+
|
61
|
+
# A bar chart provides a way of showing data values represented
|
62
|
+
# as vertical bars. It is sometimes used to show trend data,
|
63
|
+
# and the comparison of multiple data sets side by side.
|
64
|
+
def self.bar(type = :vertical, &block)
|
65
|
+
chart = Chart.new
|
66
|
+
case type
|
67
|
+
when :vertical
|
68
|
+
chart.type('bar')
|
69
|
+
when :horizontal
|
70
|
+
chart.type('horizontalBar')
|
71
|
+
end
|
72
|
+
chart.build(&block)
|
73
|
+
end
|
74
|
+
|
75
|
+
# Need to send some server-side event data? You found your method. Optionally, it'll
|
76
|
+
# even call the "to_json" on the object your sending ( if it accepts
|
77
|
+
# that method call ); otherwise you should really only send
|
78
|
+
# JSON that is already formatted. Otherwise it'll just send the plaintext.
|
79
|
+
#
|
80
|
+
# Live life the way you want to.
|
81
|
+
def self.data(json: false, &block)
|
82
|
+
if json
|
83
|
+
"data: #{block.call} \r\n\n"
|
84
|
+
else
|
85
|
+
"data: #{block.call.to_json} \r\n\n"
|
86
|
+
end
|
20
87
|
end
|
21
88
|
end
|
@@ -44,7 +44,7 @@ module ChartJS
|
|
44
44
|
@opts = Opts.new.build(&block)
|
45
45
|
end
|
46
46
|
|
47
|
-
def cdn(version: "2.
|
47
|
+
def cdn(version: "2.9.3", min: true)
|
48
48
|
if min
|
49
49
|
"<script src=\"https://cdnjs.cloudflare.com/ajax/libs/Chart.js/#{version}/Chart.min.js\"></script>"
|
50
50
|
else
|
@@ -67,13 +67,13 @@ module ChartJS
|
|
67
67
|
var ctx = document.getElementById(\"#{id}\").getContext(\"2d\");
|
68
68
|
new Chart(ctx, config);
|
69
69
|
};
|
70
|
-
</script>"
|
70
|
+
</script>"
|
71
71
|
end
|
72
72
|
|
73
73
|
def to_html(width: "60%", heigth: width, head: true, cdn: head, version: "2.6.0", body: true, id: random_id, script: true)
|
74
74
|
str = []
|
75
75
|
if cdn
|
76
|
-
str << "<head>#{cdn(version: version)}</head>"
|
76
|
+
str << "<head>#{cdn(version: version)}</head>"
|
77
77
|
end
|
78
78
|
str << "<body>" if body
|
79
79
|
str << "<div id=\"canvas-holder\" style=\"width:#{width} heigth:#{heigth}\">"
|
data/lib/chart_js/chart/chart.rb
CHANGED
@@ -3,16 +3,19 @@ require "securerandom"
|
|
3
3
|
require_relative "data.rb"
|
4
4
|
require_relative "opts.rb"
|
5
5
|
require_relative "file.rb"
|
6
|
+
require_relative "event_stream.rb"
|
6
7
|
|
7
8
|
module ChartJS
|
8
9
|
|
9
10
|
class Chart
|
10
11
|
|
11
12
|
def initialize(&block)
|
12
|
-
@type
|
13
|
-
@data
|
14
|
-
@opts
|
15
|
-
@file
|
13
|
+
@type = nil
|
14
|
+
@data = nil
|
15
|
+
@opts = nil
|
16
|
+
@file = false
|
17
|
+
@stream = false
|
18
|
+
@chart_obj = 'chart' + SecureRandom.uuid.gsub("-","")
|
16
19
|
build(&block) if block_given?
|
17
20
|
end
|
18
21
|
|
@@ -26,7 +29,21 @@ module ChartJS
|
|
26
29
|
end
|
27
30
|
|
28
31
|
def to_h
|
29
|
-
|
32
|
+
case type
|
33
|
+
when 'pie'
|
34
|
+
{ type: @type, data: @data.to_h(:pie), options: @opts.to_h }
|
35
|
+
when 'doughnut'
|
36
|
+
{ type: @type, data: @data.to_h(:pie), options: @opts.to_h }
|
37
|
+
when 'line'
|
38
|
+
data = @data.to_h(false)
|
39
|
+
data['datasets'].each do |set|
|
40
|
+
set['fill'] = false unless set['fill']
|
41
|
+
end
|
42
|
+
#data['fill'] = false unless data['fill']
|
43
|
+
{ type: @type, data: data, options: @opts.to_h }
|
44
|
+
else
|
45
|
+
{ type: @type, data: @data.to_h(false), options: @opts.to_h }
|
46
|
+
end
|
30
47
|
end
|
31
48
|
|
32
49
|
def to_json(type = :pretty)
|
@@ -49,7 +66,7 @@ module ChartJS
|
|
49
66
|
@opts = Opts.new.build(&block)
|
50
67
|
end
|
51
68
|
|
52
|
-
def cdn(version: "2.
|
69
|
+
def cdn(version: "2.9.3", min: true)
|
53
70
|
if min
|
54
71
|
"<script src=\"https://cdnjs.cloudflare.com/ajax/libs/Chart.js/#{version}/Chart.min.js\"></script>"
|
55
72
|
else
|
@@ -61,31 +78,42 @@ module ChartJS
|
|
61
78
|
"##{SecureRandom.hex(3)}"
|
62
79
|
end
|
63
80
|
|
64
|
-
def
|
65
|
-
|
81
|
+
def chart_obj(value = nil)
|
82
|
+
return @chart_obj if value.nil?
|
83
|
+
@chart_obj = value
|
84
|
+
end
|
85
|
+
|
86
|
+
def random_id(force: false)
|
87
|
+
return @id unless @id.nil? or force
|
88
|
+
@id = SecureRandom.uuid
|
89
|
+
end
|
90
|
+
|
91
|
+
|
92
|
+
def event_stream(path, chart: chart_obj, &block)
|
93
|
+
@stream = EventStream.new(path, chart)
|
94
|
+
@stream.build(&block) if block_given?
|
66
95
|
end
|
67
96
|
|
68
|
-
def script(config: to_json, id: random_id,
|
97
|
+
def script(config: to_json, id: random_id, chart: chart_obj)
|
69
98
|
"<script>
|
70
99
|
var config = #{config}
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
};
|
75
|
-
</script>"
|
100
|
+
var ctx = document.getElementById(\"#{id}\").getContext(\"2d\");
|
101
|
+
var #{chart} = new Chart(ctx, config);
|
102
|
+
</script>"
|
76
103
|
end
|
77
104
|
|
78
|
-
def to_html(width: "60%", heigth: width, head: true, cdn: head, version: "2.6.0", body: true, id: random_id, script: true,
|
105
|
+
def to_html(width: "60%", heigth: width, head: true, cdn: head, version: "2.6.0", body: true, id: random_id, script: true, chart: chart_obj, stream: true)
|
79
106
|
str = []
|
80
107
|
if cdn
|
81
|
-
str << "<head>#{cdn(version: version)}</head>"
|
108
|
+
str << "<head>#{cdn(version: version)}</head>"
|
82
109
|
end
|
83
110
|
str << "<body>" if body
|
84
111
|
str << "<div id=\"canvas-holder\" style=\"width:#{width} heigth:#{heigth}\">"
|
85
112
|
str << "<canvas id=\"#{id}\"/>"
|
86
113
|
str << "</div>"
|
87
114
|
str << "</body>" if body
|
88
|
-
str << script(id: id,
|
115
|
+
str << script(id: id, chart: chart) if script
|
116
|
+
str << @stream.to_html if @stream && stream
|
89
117
|
str.join("\n")
|
90
118
|
end
|
91
119
|
|
data/lib/chart_js/chart/data.rb
CHANGED
@@ -1,14 +1,17 @@
|
|
1
1
|
require_relative "dataset.rb"
|
2
|
+
require_relative "helpers/dates.rb"
|
2
3
|
|
3
4
|
module ChartJS
|
4
5
|
|
5
6
|
class Data
|
6
7
|
|
8
|
+
include Helpers::Dates
|
9
|
+
|
7
10
|
def initialize
|
8
11
|
@container = Hash.new
|
9
12
|
@datasets = Hash.new
|
10
13
|
end
|
11
|
-
|
14
|
+
|
12
15
|
def build(&block)
|
13
16
|
instance_eval(&block)
|
14
17
|
self
|
@@ -23,13 +26,34 @@ module ChartJS
|
|
23
26
|
@datasets[label] = Dataset.new(label, &block)
|
24
27
|
end
|
25
28
|
|
26
|
-
def to_h
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
29
|
+
def to_h(type)
|
30
|
+
case type
|
31
|
+
when :pie
|
32
|
+
@container
|
33
|
+
@container['labels'] = Array.new
|
34
|
+
@container['datasets'] = Array.new
|
35
|
+
@container['datasets'] << Hash.new
|
36
|
+
@datasets.each do |label, data|
|
37
|
+
@container['labels'] << label
|
38
|
+
data.to_h.each do |key, value|
|
39
|
+
if @container['datasets'][0][key].is_a? Array
|
40
|
+
@container['datasets'][0][key] << value
|
41
|
+
else
|
42
|
+
@container['datasets'][0][key] = Array.new
|
43
|
+
@container['datasets'][0][key] << value
|
44
|
+
end
|
45
|
+
end
|
46
|
+
end
|
47
|
+
@container
|
48
|
+
else
|
49
|
+
cont = @container.dup
|
50
|
+
cont['datasets'] = []
|
51
|
+
@datasets.each do |_, data|
|
52
|
+
cont['datasets'] << data.to_h
|
53
|
+
end
|
54
|
+
cont
|
55
|
+
|
31
56
|
end
|
32
|
-
cont
|
33
57
|
end
|
34
58
|
|
35
59
|
end
|
@@ -10,7 +10,32 @@ module ChartJS
|
|
10
10
|
instance_eval(&block)
|
11
11
|
@container
|
12
12
|
end
|
13
|
+
|
14
|
+
def stepped(value = true)
|
15
|
+
@container['steppedLine'] = case value
|
16
|
+
when true # Step-before Interpolation -> eq "before"
|
17
|
+
true
|
18
|
+
when false # No Step Interpolation
|
19
|
+
false
|
20
|
+
when :before || "before"
|
21
|
+
"before"
|
22
|
+
when :after || "after"
|
23
|
+
"after"
|
24
|
+
else
|
25
|
+
raise "Oops."
|
26
|
+
end
|
27
|
+
end
|
13
28
|
|
29
|
+
def tension(value = 1)
|
30
|
+
if value.is_a? Integer
|
31
|
+
@container['lineTension'] = value
|
32
|
+
elsif value == "flase" || value == :false
|
33
|
+
@container['lineTension'] = 0
|
34
|
+
else
|
35
|
+
raise "Oops"
|
36
|
+
end
|
37
|
+
end
|
38
|
+
|
14
39
|
end
|
15
40
|
|
16
41
|
end
|
@@ -0,0 +1,68 @@
|
|
1
|
+
require_relative 'event_streams/event_streams'
|
2
|
+
|
3
|
+
module ChartJS
|
4
|
+
|
5
|
+
class EventStream
|
6
|
+
|
7
|
+
def to_html(source: @path, chart: @chart)
|
8
|
+
str = ""
|
9
|
+
str << "<script>\n"
|
10
|
+
str << "var source = new EventSource('#{path}');\n"
|
11
|
+
str << "var json;\n"
|
12
|
+
str << @counter if @counter
|
13
|
+
str << @push.to_s if @push
|
14
|
+
str << @pop if @pop
|
15
|
+
str << @raw if @raw
|
16
|
+
str << "</script>\n"
|
17
|
+
end
|
18
|
+
|
19
|
+
def push(dataset: 0, chart: @chart, &block)
|
20
|
+
@push = EventStreams.push(dataset: dataset, chart: @chart, &block)
|
21
|
+
end
|
22
|
+
|
23
|
+
#def count(dataset: 0, chart: @chart, &block)
|
24
|
+
|
25
|
+
|
26
|
+
#end
|
27
|
+
|
28
|
+
def raw(chart: @chart, str: nil, file: nil, without_source: true, update: true)
|
29
|
+
@raw = ""
|
30
|
+
@raw = @raw + "source.onmessage = function(e) { json = JSON.parse(e.data);"
|
31
|
+
return @raw if str.nil? and file.nil?
|
32
|
+
@raw = @raw + str unless str.nil?
|
33
|
+
@raw = @raw + File.readlines(file) unless file.nil?
|
34
|
+
@rar = @raw + "#{chart}.update();" if update
|
35
|
+
@raw = @raw + "};"
|
36
|
+
end
|
37
|
+
|
38
|
+
def counter(dataset:, chart: @chart, counter: "counter")
|
39
|
+
str = ""
|
40
|
+
str << "var #{counter} = 0;\n"
|
41
|
+
str << "source.onmessage = function(e) { #{counter} += 1 };\n"
|
42
|
+
end
|
43
|
+
|
44
|
+
def chart(chart_obj = nil)
|
45
|
+
return @chart if chart_obj.nil?
|
46
|
+
@chart = chart_obj
|
47
|
+
end
|
48
|
+
|
49
|
+
def initialize(path, chart)
|
50
|
+
@push = nil
|
51
|
+
chart(chart)
|
52
|
+
path(path)
|
53
|
+
build(block) if block_given?
|
54
|
+
end
|
55
|
+
|
56
|
+
def build(&block)
|
57
|
+
instance_eval(&block)
|
58
|
+
self
|
59
|
+
end
|
60
|
+
|
61
|
+
def path(value = nil)
|
62
|
+
return @path if value.nil?
|
63
|
+
@path = value
|
64
|
+
end
|
65
|
+
|
66
|
+
end
|
67
|
+
|
68
|
+
end
|
@@ -0,0 +1,80 @@
|
|
1
|
+
module ChartJS
|
2
|
+
|
3
|
+
module EventStreams
|
4
|
+
class Push
|
5
|
+
def initialize(chart:, dataset:, &block)
|
6
|
+
@str = ""
|
7
|
+
@chart = chart
|
8
|
+
dataset(dataset)
|
9
|
+
@str << "source.onmessage = function(e) { \n"
|
10
|
+
@str << "json = JSON.parse(e.data);\n"
|
11
|
+
base(json: 'data', dataset: dataset, chart: chart)
|
12
|
+
@str << "if(json.label){ #{chart}.data.labels.push(json.label); }\n"
|
13
|
+
@str << "#{chart}.update();\n"
|
14
|
+
build(&block) if block_given?
|
15
|
+
@str << "\n};"
|
16
|
+
end
|
17
|
+
|
18
|
+
def build(&block)
|
19
|
+
instance_eval(&block)
|
20
|
+
self
|
21
|
+
end
|
22
|
+
|
23
|
+
def dataset(value = nil)
|
24
|
+
return @dataset || 0 if value.nil?
|
25
|
+
@dataset = value
|
26
|
+
end
|
27
|
+
|
28
|
+
def point(type, chart: @chart, dataset: @dataset)
|
29
|
+
case type
|
30
|
+
when :hit_radius
|
31
|
+
base(json: 'pointHitRadius', dataset: dataset, chart: chart)
|
32
|
+
when :style
|
33
|
+
base(json: 'point_style', dataset: dataset, chart: chart)
|
34
|
+
when :border
|
35
|
+
color :border, chart: chart, dataset: dataset
|
36
|
+
base(json: 'pointBorder', dataset: dataset, chart: chart)
|
37
|
+
base(json: 'pointBorderWidth', dataset: dataset, chart: chart)
|
38
|
+
when :radius
|
39
|
+
base(json: 'pointRadius', dataset: dataset, chart: chart)
|
40
|
+
when :hover_radius
|
41
|
+
base(json: 'pointHoverRadius', dataset: dataset, chart: chart)
|
42
|
+
else
|
43
|
+
point :hit_radius, chart: chart, dataset: dataset
|
44
|
+
point :style, chart: chart, dataset: dataset
|
45
|
+
point :border, chart: chart, dataset: dataset
|
46
|
+
point :hover_radius, chart: chart, dataset: dataset
|
47
|
+
end
|
48
|
+
end
|
49
|
+
|
50
|
+
def color(type, chart: @chart, dataset: @dataset)
|
51
|
+
case type
|
52
|
+
when :background
|
53
|
+
base(json: 'backgroundColor', dataset: dataset, chart: chart)
|
54
|
+
when :border
|
55
|
+
base(json: 'borderColor', dataset: dataset, chart: chart)
|
56
|
+
when :point
|
57
|
+
base(json: 'pointBackgroundColor', dataset: dataset, chart: chart)
|
58
|
+
base(json: 'pointBorderColor', dataset: dataset, chart: chart)
|
59
|
+
base(json: 'pointHoverBackgroundColor', dataset: dataset, chart: chart)
|
60
|
+
base(json: 'pointHoverBorderColor', dataset: dataset, chart: chart)
|
61
|
+
base(json: 'pointHoverBorderColor', dataset: dataset, chart: chart)
|
62
|
+
base(json: 'pointHoverBorderColor', dataset: dataset, chart: chart)
|
63
|
+
else
|
64
|
+
color :background, chart: chart, dataset: dataset
|
65
|
+
color :border, chart: chart, dataset: dataset
|
66
|
+
color :point, chart: chart, dataset: dataset
|
67
|
+
end
|
68
|
+
end
|
69
|
+
|
70
|
+
def base(json:, chart:, dataset:, raw: false)
|
71
|
+
@str << "if(json.#{json}){ #{chart}.data.datasets[#{dataset}].#{json}.push(json.#{json}); }\n"
|
72
|
+
end
|
73
|
+
|
74
|
+
def to_s
|
75
|
+
@str
|
76
|
+
end
|
77
|
+
end
|
78
|
+
end
|
79
|
+
|
80
|
+
end
|
@@ -0,0 +1,54 @@
|
|
1
|
+
require 'date'
|
2
|
+
|
3
|
+
module ChartJS
|
4
|
+
|
5
|
+
module Helpers
|
6
|
+
|
7
|
+
module Dates
|
8
|
+
WORK_DAYS = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday']
|
9
|
+
MONDAY_TO_SUNDAY = WORK_DAYS + ['Saturday', 'Sunday']
|
10
|
+
|
11
|
+
def days_of_the_week(abrv: false)
|
12
|
+
days = if abrv
|
13
|
+
Date::DAYNAMES
|
14
|
+
else
|
15
|
+
Date::ABBR_DAYNAMES
|
16
|
+
end
|
17
|
+
return days unless block_given?
|
18
|
+
days.each do |day|
|
19
|
+
yield day
|
20
|
+
end
|
21
|
+
end
|
22
|
+
|
23
|
+
def work_days
|
24
|
+
return WORK_DAYS unless block_given?
|
25
|
+
WORK_DAYS.each do |day|
|
26
|
+
yield day
|
27
|
+
end
|
28
|
+
end
|
29
|
+
|
30
|
+
alias monday_to_friday work_days
|
31
|
+
|
32
|
+
def monday_to_sunday
|
33
|
+
return MONDAY_TO_SUNDAY unless block_given?
|
34
|
+
MONDAY_TO_SUNDAY.each do |day|
|
35
|
+
yield day
|
36
|
+
end
|
37
|
+
end
|
38
|
+
|
39
|
+
def months_of_the_year(abrv: false)
|
40
|
+
months = if abrv
|
41
|
+
Date::MONTHNAMES.reject(&:nil?)
|
42
|
+
else
|
43
|
+
Date::ABBR_MONTHNAMES.reject(&:nil?)
|
44
|
+
end
|
45
|
+
return months unless block_given?
|
46
|
+
months.each do |month|
|
47
|
+
yield month
|
48
|
+
end
|
49
|
+
end
|
50
|
+
end
|
51
|
+
|
52
|
+
end
|
53
|
+
|
54
|
+
end
|
@@ -44,7 +44,7 @@ module ChartJS
|
|
44
44
|
@opts = Opts.new.build(&block)
|
45
45
|
end
|
46
46
|
|
47
|
-
def cdn(version: "2.
|
47
|
+
def cdn(version: "2.9.3", min: true)
|
48
48
|
if min
|
49
49
|
"<script src=\"https://cdnjs.cloudflare.com/ajax/libs/Chart.js/#{version}/Chart.min.js\"></script>"
|
50
50
|
else
|
@@ -70,13 +70,13 @@ module ChartJS
|
|
70
70
|
// var ctx = document.getElementById(\"#{id}\").getContext(\"2d\");
|
71
71
|
// var #{chart_name.gsub("-","_")} = new Chart(ctx, config);
|
72
72
|
//};
|
73
|
-
</script>"
|
73
|
+
</script>"
|
74
74
|
end
|
75
75
|
|
76
76
|
def to_html(width: "60%", heigth: width, head: true, cdn: head, version: "2.6.0", body: true, id: random_id, script: true, chart_name: "line_chart")
|
77
77
|
str = []
|
78
78
|
if cdn
|
79
|
-
str << "<head>#{cdn(version: version)}</head>"
|
79
|
+
str << "<head>#{cdn(version: version)}</head>"
|
80
80
|
end
|
81
81
|
str << "<body>" if body
|
82
82
|
str << "<div id=\"canvas-holder\" style=\"width:#{width} heigth:#{heigth}\">"
|
data/lib/chart_js/chart/opts.rb
CHANGED
@@ -1,18 +1,25 @@
|
|
1
|
-
require_relative "dataset.rb"
|
2
|
-
|
3
1
|
module ChartJS
|
4
2
|
|
5
|
-
class
|
3
|
+
class Opts
|
6
4
|
|
7
5
|
def initialize
|
8
6
|
@container = Hash.new
|
9
7
|
end
|
10
|
-
|
8
|
+
|
11
9
|
def build(&block)
|
12
10
|
instance_eval(&block)
|
13
11
|
@container
|
14
12
|
end
|
15
13
|
|
14
|
+
def cutout(value = nil)
|
15
|
+
return @container['cutoutPercentage'] if value.nil?
|
16
|
+
@container['cutoutPercentage'] = value
|
17
|
+
end
|
18
|
+
|
19
|
+
def to_h
|
20
|
+
@container
|
21
|
+
end
|
22
|
+
|
16
23
|
end
|
17
24
|
|
18
25
|
end
|
@@ -6,7 +6,7 @@ require_relative "file.rb"
|
|
6
6
|
|
7
7
|
module ChartJS
|
8
8
|
|
9
|
-
class RadarChart
|
9
|
+
class RadarChart
|
10
10
|
|
11
11
|
def initialize(&block)
|
12
12
|
@type = "radar"
|
@@ -44,7 +44,7 @@ module ChartJS
|
|
44
44
|
@opts = Opts.new.build(&block)
|
45
45
|
end
|
46
46
|
|
47
|
-
def cdn(version: "2.
|
47
|
+
def cdn(version: "2.9.3", min: true)
|
48
48
|
if min
|
49
49
|
"<script src=\"https://cdnjs.cloudflare.com/ajax/libs/Chart.js/#{version}/Chart.min.js\"></script>"
|
50
50
|
else
|
@@ -67,13 +67,13 @@ module ChartJS
|
|
67
67
|
var ctx = document.getElementById(\"#{id}\").getContext(\"2d\");
|
68
68
|
new Chart(ctx, config);
|
69
69
|
};
|
70
|
-
</script>"
|
70
|
+
</script>"
|
71
71
|
end
|
72
72
|
|
73
73
|
def to_html(width: "60%", heigth: width, head: true, cdn: head, version: "2.6.0", body: true, id: random_id, script: true)
|
74
74
|
str = []
|
75
75
|
if cdn
|
76
|
-
str << "<head>#{cdn(version: version)}</head>"
|
76
|
+
str << "<head>#{cdn(version: version)}</head>"
|
77
77
|
end
|
78
78
|
str << "<body>" if body
|
79
79
|
str << "<div id=\"canvas-holder\" style=\"width:#{width} heigth:#{heigth}\">"
|
data/lib/chart_js/version.rb
CHANGED
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: chart_js
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.0
|
4
|
+
version: 1.1.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Kent 'picat' Gruber
|
8
8
|
autorequire:
|
9
|
-
bindir:
|
9
|
+
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date:
|
11
|
+
date: 2020-01-18 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: bundler
|
@@ -16,28 +16,28 @@ dependencies:
|
|
16
16
|
requirements:
|
17
17
|
- - "~>"
|
18
18
|
- !ruby/object:Gem::Version
|
19
|
-
version: '1
|
19
|
+
version: '2.1'
|
20
20
|
type: :development
|
21
21
|
prerelease: false
|
22
22
|
version_requirements: !ruby/object:Gem::Requirement
|
23
23
|
requirements:
|
24
24
|
- - "~>"
|
25
25
|
- !ruby/object:Gem::Version
|
26
|
-
version: '1
|
26
|
+
version: '2.1'
|
27
27
|
- !ruby/object:Gem::Dependency
|
28
28
|
name: rake
|
29
29
|
requirement: !ruby/object:Gem::Requirement
|
30
30
|
requirements:
|
31
31
|
- - "~>"
|
32
32
|
- !ruby/object:Gem::Version
|
33
|
-
version: '
|
33
|
+
version: '13.0'
|
34
34
|
type: :development
|
35
35
|
prerelease: false
|
36
36
|
version_requirements: !ruby/object:Gem::Requirement
|
37
37
|
requirements:
|
38
38
|
- - "~>"
|
39
39
|
- !ruby/object:Gem::Version
|
40
|
-
version: '
|
40
|
+
version: '13.0'
|
41
41
|
- !ruby/object:Gem::Dependency
|
42
42
|
name: rspec
|
43
43
|
requirement: !ruby/object:Gem::Requirement
|
@@ -52,6 +52,20 @@ dependencies:
|
|
52
52
|
- - "~>"
|
53
53
|
- !ruby/object:Gem::Version
|
54
54
|
version: '3.0'
|
55
|
+
- !ruby/object:Gem::Dependency
|
56
|
+
name: pry
|
57
|
+
requirement: !ruby/object:Gem::Requirement
|
58
|
+
requirements:
|
59
|
+
- - "~>"
|
60
|
+
- !ruby/object:Gem::Version
|
61
|
+
version: '0.12'
|
62
|
+
type: :development
|
63
|
+
prerelease: false
|
64
|
+
version_requirements: !ruby/object:Gem::Requirement
|
65
|
+
requirements:
|
66
|
+
- - "~>"
|
67
|
+
- !ruby/object:Gem::Version
|
68
|
+
version: '0.12'
|
55
69
|
description:
|
56
70
|
email:
|
57
71
|
- kgruber1@emich.edu
|
@@ -61,21 +75,26 @@ extra_rdoc_files: []
|
|
61
75
|
files:
|
62
76
|
- ".gitignore"
|
63
77
|
- ".rspec"
|
64
|
-
- ".travis.yml"
|
65
78
|
- CODE_OF_CONDUCT.md
|
66
79
|
- Gemfile
|
67
80
|
- LICENSE.txt
|
68
81
|
- README.md
|
69
82
|
- Rakefile
|
70
|
-
- bin/console
|
71
|
-
- bin/setup
|
72
83
|
- chart_js.gemspec
|
73
84
|
- examples/bar_chart.rb
|
85
|
+
- examples/bar_chart_2.rb
|
86
|
+
- examples/bar_chart_event_stream.rb
|
74
87
|
- examples/build.rb
|
75
88
|
- examples/debug.rb
|
89
|
+
- examples/doughnut_chart.rb
|
76
90
|
- examples/line_chart.rb
|
91
|
+
- examples/line_chart_2.rb
|
92
|
+
- examples/line_chart_event_stream.rb
|
93
|
+
- examples/pie_chart.rb
|
77
94
|
- examples/radar_chart.rb
|
95
|
+
- examples/radar_chart_2.rb
|
78
96
|
- examples/sinatra.rb
|
97
|
+
- examples/wifi_signal_chart.rb
|
79
98
|
- lib/chart_js.rb
|
80
99
|
- lib/chart_js/chart/bar_chart/background.rb
|
81
100
|
- lib/chart_js/chart/bar_chart/bar_chart.rb
|
@@ -95,7 +114,6 @@ files:
|
|
95
114
|
- lib/chart_js/chart/bar_chart/point_border.rb
|
96
115
|
- lib/chart_js/chart/bar_chart/point_hover.rb
|
97
116
|
- lib/chart_js/chart/chart.rb
|
98
|
-
- lib/chart_js/chart/charts.rb
|
99
117
|
- lib/chart_js/chart/data.rb
|
100
118
|
- lib/chart_js/chart/dataset.rb
|
101
119
|
- lib/chart_js/chart/dataset/background.rb
|
@@ -104,7 +122,11 @@ files:
|
|
104
122
|
- lib/chart_js/chart/dataset/point.rb
|
105
123
|
- lib/chart_js/chart/dataset/point_border.rb
|
106
124
|
- lib/chart_js/chart/dataset/point_hover.rb
|
125
|
+
- lib/chart_js/chart/event_stream.rb
|
126
|
+
- lib/chart_js/chart/event_streams/event_streams.rb
|
127
|
+
- lib/chart_js/chart/event_streams/push.rb
|
107
128
|
- lib/chart_js/chart/file.rb
|
129
|
+
- lib/chart_js/chart/helpers/dates.rb
|
108
130
|
- lib/chart_js/chart/line_chart/background.rb
|
109
131
|
- lib/chart_js/chart/line_chart/border.rb
|
110
132
|
- lib/chart_js/chart/line_chart/data.rb
|
@@ -156,12 +178,11 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
156
178
|
version: '0'
|
157
179
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
158
180
|
requirements:
|
159
|
-
- - "
|
181
|
+
- - ">="
|
160
182
|
- !ruby/object:Gem::Version
|
161
|
-
version:
|
183
|
+
version: '0'
|
162
184
|
requirements: []
|
163
|
-
|
164
|
-
rubygems_version: 2.6.8
|
185
|
+
rubygems_version: 3.0.6
|
165
186
|
signing_key:
|
166
187
|
specification_version: 4
|
167
188
|
summary: A simple ruby DSL to build responive charts for the web using Chart.js
|
data/.travis.yml
DELETED
data/bin/console
DELETED
@@ -1,14 +0,0 @@
|
|
1
|
-
#!/usr/bin/env ruby
|
2
|
-
|
3
|
-
require "bundler/setup"
|
4
|
-
require "chart_js"
|
5
|
-
|
6
|
-
# You can add fixtures and/or initialization code here to make experimenting
|
7
|
-
# with your gem easier. You can also use a different console, if you like.
|
8
|
-
|
9
|
-
# (If you use this, don't forget to add pry to your Gemfile!)
|
10
|
-
# require "pry"
|
11
|
-
# Pry.start
|
12
|
-
|
13
|
-
require "irb"
|
14
|
-
IRB.start(__FILE__)
|
data/bin/setup
DELETED
@@ -1,22 +0,0 @@
|
|
1
|
-
require "json"
|
2
|
-
require "securerandom"
|
3
|
-
require_relative "line_chart/line_chart.rb"
|
4
|
-
require_relative "bar_chart/bar_chart.rb"
|
5
|
-
require_relative "radar_chart/radar_chart.rb"
|
6
|
-
|
7
|
-
module ChartJS
|
8
|
-
module Charts
|
9
|
-
def self.debug(&block)
|
10
|
-
Chart.new(&block)
|
11
|
-
end
|
12
|
-
def self.line(&block)
|
13
|
-
LineChart.new(&block)
|
14
|
-
end
|
15
|
-
def self.bar(&block)
|
16
|
-
BarChart.new(&block)
|
17
|
-
end
|
18
|
-
def self.radar(&block)
|
19
|
-
RadarChart.new(&block)
|
20
|
-
end
|
21
|
-
end
|
22
|
-
end
|