playbook_ui_docs 13.22.0.pre.alpha.PLAY1297updatetextstyles2636 → 13.22.0.pre.alpha.pbntr254barchartnegativenumber2640
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_negative_numbers.html.erb +23 -0
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_negative_numbers.jsx +35 -0
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_stacked.html.erb +22 -0
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_stacked.jsx +34 -0
- data/app/pb_kits/playbook/pb_bar_graph/docs/example.yml +4 -1
- data/app/pb_kits/playbook/pb_bar_graph/docs/index.js +2 -0
- data/dist/playbook-doc.js +5 -5
- metadata +6 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 249c45e622d09f7c5dcfc0c64217521521467c1cd6f0f970e6b3315564fec4a8
|
4
|
+
data.tar.gz: fd671a0a92e74f736bc7e11cb143f588ac2dc09d5fa05231b0b443674968f723
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 96addf1bebc2865b8e3433bda090081b1dd6427deacef0eb555e4b72d59ffedeaf4b51354e0dd59924a0ce8c48c8e65989b0239006ecebe5dad591bdcd71af05
|
7
|
+
data.tar.gz: eb7e89e30197337b9ca02dd966d825d99f3f349bb73e3f951a350ac9a0170ac6b3c64301c3c304cf1c933b0a2aeb36b6c1187310d68b49c8929f11f462b27f47
|
@@ -0,0 +1,23 @@
|
|
1
|
+
<% data = [{
|
2
|
+
name: 'Installation',
|
3
|
+
data: [-475, 400, -1000, 354, -856],
|
4
|
+
threshold: 0
|
5
|
+
}, {
|
6
|
+
name: 'Manufacturing',
|
7
|
+
data: [1475, 200, 1000, 654, -656],
|
8
|
+
threshold: 0
|
9
|
+
},
|
10
|
+
{
|
11
|
+
name: 'Sales & Distribution',
|
12
|
+
data: [1270, 100, -1200, 554, 756],
|
13
|
+
threshold: 0
|
14
|
+
}] %>
|
15
|
+
|
16
|
+
<%= pb_rails("bar_graph", props: {
|
17
|
+
axis_title: 'Number of Employees',
|
18
|
+
chart_data: data,
|
19
|
+
id: "bar-default",
|
20
|
+
x_axis_categories:['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'],
|
21
|
+
title: 'Bar Graph with Stacked Columns',
|
22
|
+
legend: true,
|
23
|
+
}) %>
|
@@ -0,0 +1,35 @@
|
|
1
|
+
import React from 'react'
|
2
|
+
|
3
|
+
import BarGraph from '../_bar_graph'
|
4
|
+
|
5
|
+
const chartData = [{
|
6
|
+
name: 'Installation',
|
7
|
+
data: [-475, 400, -1000, 354, -856],
|
8
|
+
threshold: 0
|
9
|
+
}, {
|
10
|
+
name: 'Manufacturing',
|
11
|
+
data: [1475, 200, 1000, 654, -656],
|
12
|
+
threshold: 0
|
13
|
+
},
|
14
|
+
{
|
15
|
+
name: 'Sales & Distribution',
|
16
|
+
data: [1270, 100, -1200, 554, 756],
|
17
|
+
threshold: 0
|
18
|
+
}]
|
19
|
+
|
20
|
+
|
21
|
+
const BarGraphStacked = (props) => (
|
22
|
+
<div>
|
23
|
+
<BarGraph
|
24
|
+
axisTitle="Number of Employees"
|
25
|
+
chartData={chartData}
|
26
|
+
id="bar-default"
|
27
|
+
legend
|
28
|
+
title="Bar Graph with Negative Numbers"
|
29
|
+
xAxisCategories={['Jan', 'Feb', 'Mar', 'Apr', 'May']}
|
30
|
+
{...props}
|
31
|
+
/>
|
32
|
+
</div>
|
33
|
+
)
|
34
|
+
|
35
|
+
export default BarGraphStacked
|
@@ -0,0 +1,22 @@
|
|
1
|
+
<% data = [{
|
2
|
+
name: 'Installation',
|
3
|
+
data: [1475, 200, 3000, 654, 656],
|
4
|
+
},
|
5
|
+
{
|
6
|
+
name: 'Manufacturing',
|
7
|
+
data: [1270, 800, 200, 454, 956],
|
8
|
+
}, {
|
9
|
+
name: 'Sales & Distribution',
|
10
|
+
data: [975, 1600, 1500, 924, 500],
|
11
|
+
}] %>
|
12
|
+
|
13
|
+
<%= pb_rails("bar_graph", props: {
|
14
|
+
axis_title: 'Number of Employees',
|
15
|
+
chart_data: data,
|
16
|
+
id: "bar-default",
|
17
|
+
y_axis_min: 0,
|
18
|
+
x_axis_categories:['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'],
|
19
|
+
stacking: "normal",
|
20
|
+
title: 'Bar Graph with Stacked Columns',
|
21
|
+
legend: true,
|
22
|
+
}) %>
|
@@ -0,0 +1,34 @@
|
|
1
|
+
import React from 'react'
|
2
|
+
|
3
|
+
import BarGraph from '../_bar_graph'
|
4
|
+
|
5
|
+
const chartData = [{
|
6
|
+
name: 'Installation',
|
7
|
+
data: [1475, 200, 3000, 654, 656],
|
8
|
+
},
|
9
|
+
{
|
10
|
+
name: 'Manufacturing',
|
11
|
+
data: [1270, 800, 200, 454, 956],
|
12
|
+
}, {
|
13
|
+
name: 'Sales & Distribution',
|
14
|
+
data: [975, 1600, 1500, 924, 500],
|
15
|
+
}]
|
16
|
+
|
17
|
+
|
18
|
+
const BarGraphStacked = (props) => (
|
19
|
+
<div>
|
20
|
+
<BarGraph
|
21
|
+
axisTitle="Number Of Employees"
|
22
|
+
chartData={chartData}
|
23
|
+
id="bar-default"
|
24
|
+
legend
|
25
|
+
stacking="normal"
|
26
|
+
title="Bar Graph with Stacked Columns"
|
27
|
+
xAxisCategories={['Jan', 'Feb', 'Mar', 'Apr', 'May']}
|
28
|
+
yAxisMin={0}
|
29
|
+
{...props}
|
30
|
+
/>
|
31
|
+
</div>
|
32
|
+
)
|
33
|
+
|
34
|
+
export default BarGraphStacked
|
@@ -9,7 +9,8 @@ examples:
|
|
9
9
|
- bar_graph_spline: Spline
|
10
10
|
- bar_graph_colors: Color Overrides
|
11
11
|
- bar_graph_custom: Custom Overrides
|
12
|
-
|
12
|
+
- bar_graph_stacked: Stacked
|
13
|
+
- bar_graph_negative_numbers: Negative Numbers
|
13
14
|
|
14
15
|
react:
|
15
16
|
- bar_graph_default: Default
|
@@ -20,3 +21,5 @@ examples:
|
|
20
21
|
- bar_graph_spline: Spline
|
21
22
|
- bar_graph_colors: Color Overrides
|
22
23
|
- bar_graph_custom: Custom Overrides
|
24
|
+
- bar_graph_stacked: Stacked
|
25
|
+
- bar_graph_negative_numbers: Negative Numbers
|
@@ -6,3 +6,5 @@ export { default as BarGraphHeight } from './_bar_graph_height.jsx'
|
|
6
6
|
export { default as BarGraphSpline } from './_bar_graph_spline.jsx'
|
7
7
|
export { default as BarGraphColors } from './_bar_graph_colors.jsx'
|
8
8
|
export { default as BarGraphCustom } from './_bar_graph_custom.jsx'
|
9
|
+
export { default as BarGraphStacked } from './_bar_graph_stacked.jsx'
|
10
|
+
export { default as BarGraphNegativeNumbers } from './_bar_graph_negative_numbers.jsx'
|