thecore_ui_commons 3.1.11 → 3.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/lib/echarts/speedometer.rb +163 -0
- data/lib/thecore_ui_commons/version.rb +1 -1
- data/lib/thecore_ui_commons.rb +1 -0
- metadata +2 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 5675378f9ff9fbfc745eae4fd8284a7c068440f1594ec13a0f6e4e7b486267c3
|
4
|
+
data.tar.gz: d468bfc1369d418e2053159325b86f0c0fbe960a80f810dcd3d424e93a75eb96
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 9385b2c24d2f9d8cadcadfb89983dcd49d50339590a379597712b5341503565dab84c2e80c456579f0a68e962a48a6cfac70478a37b0ec87795b1f9da00be8da
|
7
|
+
data.tar.gz: 3031a3698af5e067f2c2bc0e26484f2595e2a61b2efead74349a2070f8f3e5c9e5475d10f040c070a149e75cdfe489cac2a16e8cee372ee2592d8cb6a2519483
|
@@ -0,0 +1,163 @@
|
|
1
|
+
|
2
|
+
module Echarts
|
3
|
+
module Speedometer
|
4
|
+
# Computes the percentage of a value within a given range.
|
5
|
+
#
|
6
|
+
# @param value [Numeric] The value to compute the percentage for.
|
7
|
+
# @param lower_bound [Numeric] The lower bound of the range.
|
8
|
+
# @param upper_bound [Numeric] The upper bound of the range.
|
9
|
+
# @return [Float] The percentage of the value within the range.
|
10
|
+
def self.compute_percentage(value, lower_bound, upper_bound)
|
11
|
+
(value - lower_bound) / (upper_bound - lower_bound)
|
12
|
+
end
|
13
|
+
|
14
|
+
# Computes the angle for a given value.
|
15
|
+
#
|
16
|
+
# @param value [Float] The value to compute the angle for.
|
17
|
+
# @return [Float] The angle in degrees.
|
18
|
+
def self.compute_angle(value)
|
19
|
+
# Compute the angles from the percentages knowing that the startAngle = 225 and the endAngle = -45 clockwise
|
20
|
+
225 - (value * 270)
|
21
|
+
end
|
22
|
+
|
23
|
+
# Computes the angles for a given value and the minimum and maximum values in percentage.
|
24
|
+
#
|
25
|
+
# @param value_in_percentage [Float] The value in percentage.
|
26
|
+
# @param min_in_percentage [Float] The minimum value in percentage.
|
27
|
+
# @param max_in_percentage [Float] The maximum value in percentage.
|
28
|
+
# @return [Array<Float>] The minimum angle, maximum angle, and value angle in degrees.
|
29
|
+
def self.compute_angles(value_in_percentage, min_in_percentage, max_in_percentage)
|
30
|
+
min_angle = compute_angle(min_in_percentage)
|
31
|
+
max_angle = compute_angle(max_in_percentage)
|
32
|
+
value_angle = compute_angle(value_in_percentage)
|
33
|
+
|
34
|
+
return min_angle, max_angle, value_angle
|
35
|
+
end
|
36
|
+
|
37
|
+
# Computes the color for the gauge chart based on the minimum and maximum values.
|
38
|
+
#
|
39
|
+
# @param min [Numeric] The minimum value.
|
40
|
+
# @param max [Numeric] The maximum value.
|
41
|
+
# @param min_in_percentage [Float] The minimum value in percentage.
|
42
|
+
# @param max_in_percentage [Float] The maximum value in percentage.
|
43
|
+
# @param color_ok [String] The color for values within the range.
|
44
|
+
# @param color_error [String] The color for values outside the range.
|
45
|
+
# @param color_generic [String] The color for generic values.
|
46
|
+
# @return [Array<Array>] An array of color values and their corresponding percentages.
|
47
|
+
def self.compute_color(min, max, min_in_percentage, max_in_percentage, color_ok = "limegreen", color_error = "tomato", color_generic = "dodgerblue")
|
48
|
+
color = []
|
49
|
+
color << [min_in_percentage, color_error] if !min.zero? && (max > min || max.zero?)
|
50
|
+
color << [max_in_percentage, color_ok] if !max.zero? && (max > min || min.zero?)
|
51
|
+
color << [1, max > min ? color_error : ( max == min && max != 0 || max == 0 && min ==0 ? color_generic : color_ok )]
|
52
|
+
|
53
|
+
color
|
54
|
+
end
|
55
|
+
|
56
|
+
# Computes the options for the gauge chart.
|
57
|
+
#
|
58
|
+
# @param value [Numeric] The value to display on the gauge chart.
|
59
|
+
# @param min [Numeric] The minimum value.
|
60
|
+
# @param max [Numeric] The maximum value.
|
61
|
+
# @param lower_bound [Numeric] The lower bound of the range.
|
62
|
+
# @param upper_bound [Numeric] The upper bound of the range.
|
63
|
+
# @param measure_unit [String] The unit of measurement for the value.
|
64
|
+
# @param name [String] The name of the gauge chart.
|
65
|
+
# @param color_ok [String] The color for values within the range.
|
66
|
+
# @param color_error [String] The color for values outside the range.
|
67
|
+
# @param color_generic [String] The color for generic values.
|
68
|
+
# @return [Hash] The options for the gauge chart.
|
69
|
+
def self.get_config(value, min, max, lower_bound, upper_bound, measure_unit, name, color_ok = "limegreen", color_error = "tomato", color_generic = "dodgerblue")
|
70
|
+
min_in_percentage = compute_percentage(min, lower_bound, upper_bound)
|
71
|
+
max_in_percentage = compute_percentage(max, lower_bound, upper_bound)
|
72
|
+
value_in_percentage = compute_percentage(value, lower_bound, upper_bound)
|
73
|
+
|
74
|
+
color = compute_color(min, max, min_in_percentage, max_in_percentage, color_ok, color_error, color_generic)
|
75
|
+
min_angle, max_angle, value_angle = compute_angles(value_in_percentage, min_in_percentage, max_in_percentage)
|
76
|
+
|
77
|
+
# The gauge chart
|
78
|
+
raw_js_options = {
|
79
|
+
series: [
|
80
|
+
{
|
81
|
+
type: "gauge",
|
82
|
+
min: lower_bound,
|
83
|
+
max: upper_bound,
|
84
|
+
splitNumber: ((upper_bound - lower_bound) / lower_bound).abs,
|
85
|
+
axisLine: {
|
86
|
+
lineStyle: {
|
87
|
+
width: 30,
|
88
|
+
color: color,
|
89
|
+
},
|
90
|
+
},
|
91
|
+
pointer: {
|
92
|
+
itemStyle: {
|
93
|
+
color: "auto",
|
94
|
+
},
|
95
|
+
},
|
96
|
+
axisTick: {
|
97
|
+
distance: -30,
|
98
|
+
length: 8,
|
99
|
+
lineStyle: {
|
100
|
+
color: "#fff",
|
101
|
+
width: 2,
|
102
|
+
},
|
103
|
+
},
|
104
|
+
splitLine: {
|
105
|
+
distance: -30,
|
106
|
+
length: 30,
|
107
|
+
lineStyle: {
|
108
|
+
color: "#fff",
|
109
|
+
width: 4,
|
110
|
+
},
|
111
|
+
},
|
112
|
+
axisLabel: {
|
113
|
+
color: "inherit",
|
114
|
+
distance: 40,
|
115
|
+
fontSize: 20,
|
116
|
+
},
|
117
|
+
detail: {
|
118
|
+
valueAnimation: true,
|
119
|
+
# formatter: "#{value.to_i}#{measure_unit}",
|
120
|
+
color: "inherit",
|
121
|
+
},
|
122
|
+
data: [
|
123
|
+
{
|
124
|
+
value: value,
|
125
|
+
name: name,
|
126
|
+
},
|
127
|
+
],
|
128
|
+
},
|
129
|
+
# Dummy Gauge to be used to show the min max thresholds
|
130
|
+
{
|
131
|
+
type: "gauge",
|
132
|
+
z: 3,
|
133
|
+
startAngle: min_angle, # Here you can dinamically change the value
|
134
|
+
min: min,
|
135
|
+
endAngle: max_angle, # Here you can dinamically change the value
|
136
|
+
max: max,
|
137
|
+
splitNumber: 1,
|
138
|
+
axisLabel: {
|
139
|
+
distance: -24,
|
140
|
+
},
|
141
|
+
axisTick: {
|
142
|
+
show: false,
|
143
|
+
},
|
144
|
+
axisLine: {
|
145
|
+
lineStyle: {
|
146
|
+
width: 0,
|
147
|
+
},
|
148
|
+
},
|
149
|
+
splitLine: {
|
150
|
+
distance: -12,
|
151
|
+
# length: 50,
|
152
|
+
lineStyle: {
|
153
|
+
width: 0,
|
154
|
+
},
|
155
|
+
},
|
156
|
+
},
|
157
|
+
],
|
158
|
+
}
|
159
|
+
|
160
|
+
return raw_js_options
|
161
|
+
end
|
162
|
+
end
|
163
|
+
end
|
data/lib/thecore_ui_commons.rb
CHANGED
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: thecore_ui_commons
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 3.
|
4
|
+
version: 3.2.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Gabriele Tassoni
|
@@ -142,6 +142,7 @@ files:
|
|
142
142
|
- config/locales/it.yml
|
143
143
|
- config/routes.rb
|
144
144
|
- db/seeds.rb
|
145
|
+
- lib/echarts/speedometer.rb
|
145
146
|
- lib/tasks/thecore_ui_commons_tasks.rake
|
146
147
|
- lib/thecore_ui_commons.rb
|
147
148
|
- lib/thecore_ui_commons/engine.rb
|