Skip to content

Commit 7241716

Browse files
28raining28raining
committed
First push
1 parent c3397fc commit 7241716

File tree

7 files changed

+203
-15
lines changed

7 files changed

+203
-15
lines changed

‎CONTRIBUTING.md

+7-1
Original file line numberDiff line numberDiff line change
@@ -118,7 +118,7 @@ npm start
118118

119119
This command bundles up the source files and opens up a tab in your browser.
120120

121-
#### Step 6: Open up the console and start developing
121+
#### Step 6a: Open up the console and start developing
122122

123123
A typical workflow is to make some modifications to the source, update the
124124
test dashboard, inspect and debug the changes, then repeat. The test dashboard
@@ -146,6 +146,12 @@ Three additional helpers exist that are refreshed every second:
146146
There is also a search bar in the top right of the dashboard. This fuzzy-searches
147147
image mocks based on their file name and trace type.
148148

149+
#### Step 6b: Create a mock to test new features
150+
Create a new JSON inside
151+
`test\image\mocks\`
152+
which you'll then be able to search from the test dashboard
153+
154+
149155
#### Step 7: Regenerate plot-schema in "test" folder then review & commit potential changes
150156

151157
```bash

‎src/traces/box/attributes.js

+12-1
Original file line numberDiff line numberDiff line change
@@ -221,12 +221,14 @@ module.exports = {
221221

222222
boxmean: {
223223
valType: 'enumerated',
224-
values: [true, 'sd', false],
224+
values: [true, 'sd', '1sigma', '2sigma', '3sigma', '4sigma', '5sigma', '6sigma', false],
225225
editType: 'calc',
226226
description: [
227227
'If *true*, the mean of the box(es)\' underlying distribution is',
228228
'drawn as a dashed line inside the box(es).',
229229
'If *sd* the standard deviation is also drawn.',
230+
'If 1sigma the box is drawn between mean+-sigma, instead of median+-quartile',
231+
'1sigma, 2sigma, ... , 6sigma are availabe',
230232
'Defaults to *true* when `mean` is set.',
231233
'Defaults to *sd* when `sd` is set',
232234
'Otherwise defaults to *false*.'
@@ -378,6 +380,15 @@ module.exports = {
378380
].join(' ')
379381
},
380382

383+
whiskerdisable: {
384+
valType: 'boolean',
385+
dflt: false,
386+
editType: 'calc',
387+
description: [
388+
'Determines whether or not whiskers are visible'
389+
].join(' ')
390+
},
391+
381392
offsetgroup: barAttrs.offsetgroup,
382393
alignmentgroup: barAttrs.alignmentgroup,
383394

‎src/traces/box/defaults.js

+1
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ function supplyDefaults(traceIn, traceOut, defaultColor, layout) {
4343
coerce('boxmean', boxmeanDflt);
4444

4545
coerce('whiskerwidth');
46+
coerce('whiskerdisable');
4647
coerce('width');
4748
coerce('quartilemethod');
4849

‎src/traces/box/hover.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -179,7 +179,7 @@ function hoverOnBoxes(pointData, xval, yval, hovermode) {
179179
// clicked point from a box during click-to-select
180180
pointData2.hoverOnBox = true;
181181

182-
if(attr === 'mean' && ('sd' in di) && trace.boxmean === 'sd') {
182+
if(attr === 'mean' && ('sd' in di) && ((trace.boxmean === 'sd') || (trace.boxmean === '1sigma') || (trace.boxmean === '2sigma') || (trace.boxmean === '3sigma') || (trace.boxmean === '4sigma') || (trace.boxmean === '5sigma') || (trace.boxmean === '6sigma'))) {
183183
pointData2[vLetter + 'err'] = di.sd;
184184
}
185185

‎src/traces/box/plot.js

+36-11
Original file line numberDiff line numberDiff line change
@@ -54,6 +54,7 @@ function plotBoxAndWhiskers(sel, axes, trace, t, isStatic) {
5454
var wdPos = t.wdPos || 0;
5555
var bPosPxOffset = t.bPosPxOffset || 0;
5656
var whiskerWidth = trace.whiskerwidth || 0;
57+
var whiskerDisable = trace.whiskerdisable || false;
5758
var notched = trace.notched || false;
5859
var nw = notched ? 1 - 2 * trace.notchwidth : 1;
5960

@@ -94,12 +95,30 @@ function plotBoxAndWhiskers(sel, axes, trace, t, isStatic) {
9495

9596
var posm0 = posAxis.l2p(lcenter - bdPos0 * nw) + bPosPxOffset;
9697
var posm1 = posAxis.l2p(lcenter + bdPos1 * nw) + bPosPxOffset;
97-
var q1 = valAxis.c2p(d.q1, true);
98-
var q3 = valAxis.c2p(d.q3, true);
98+
var q1 = trace.boxmean === '1sigma' ? valAxis.c2p(d.mean - 1 * d.sd, true) :
99+
trace.boxmean === '2sigma' ? valAxis.c2p(d.mean - 2 * d.sd, true) :
100+
trace.boxmean === '3sigma' ? valAxis.c2p(d.mean - 3 * d.sd, true) :
101+
trace.boxmean === '4sigma' ? valAxis.c2p(d.mean - 4 * d.sd, true) :
102+
trace.boxmean === '5sigma' ? valAxis.c2p(d.mean - 5 * d.sd, true) :
103+
trace.boxmean === '6sigma' ? valAxis.c2p(d.mean - 6 * d.sd, true) :
104+
valAxis.c2p(d.q1, true);
105+
var q3 = trace.boxmean === '1sigma' ? valAxis.c2p(d.mean + 1 * d.sd, true) :
106+
trace.boxmean === '2sigma' ? valAxis.c2p(d.mean + 2 * d.sd, true) :
107+
trace.boxmean === '3sigma' ? valAxis.c2p(d.mean + 3 * d.sd, true) :
108+
trace.boxmean === '4sigma' ? valAxis.c2p(d.mean + 4 * d.sd, true) :
109+
trace.boxmean === '5sigma' ? valAxis.c2p(d.mean + 5 * d.sd, true) :
110+
trace.boxmean === '6sigma' ? valAxis.c2p(d.mean + 6 * d.sd, true) :
111+
valAxis.c2p(d.q3, true);
99112
// make sure median isn't identical to either of the
100113
// quartiles, so we can see it
101114
var m = Lib.constrain(
102-
valAxis.c2p(d.med, true),
115+
trace.boxmean === '1sigma' ? valAxis.c2p(d.mean, true) :
116+
trace.boxmean === '2sigma' ? valAxis.c2p(d.mean, true) :
117+
trace.boxmean === '3sigma' ? valAxis.c2p(d.mean, true) :
118+
trace.boxmean === '4sigma' ? valAxis.c2p(d.mean, true) :
119+
trace.boxmean === '5sigma' ? valAxis.c2p(d.mean, true) :
120+
trace.boxmean === '6sigma' ? valAxis.c2p(d.mean, true) :
121+
valAxis.c2p(d.med, true),
103122
Math.min(q1, q3) + 1, Math.max(q1, q3) - 1
104123
);
105124

@@ -127,10 +146,13 @@ function plotBoxAndWhiskers(sel, axes, trace, t, isStatic) {
127146
'V' + pos0 + // right edge
128147
(notched ? 'H' + un + 'L' + m + ',' + posm0 + 'L' + ln + ',' + pos0 : '') + // bottom notched edge
129148
'Z' + // end of the box
130-
'M' + q1 + ',' + posc + 'H' + lf + 'M' + q3 + ',' + posc + 'H' + uf + // whiskers
131-
(whiskerWidth === 0 ?
132-
'' : // whisker caps
133-
'M' + lf + ',' + posw0 + 'V' + posw1 + 'M' + uf + ',' + posw0 + 'V' + posw1
149+
(!whiskerDisable ?
150+
'M' + q1 + ',' + posc + 'H' + lf + 'M' + q3 + ',' + posc + 'H' + uf + // whiskers
151+
(whiskerWidth === 0 ?
152+
'' : // whisker caps
153+
'M' + lf + ',' + posw0 + 'V' + posw1 + 'M' + uf + ',' + posw0 + 'V' + posw1
154+
) :
155+
''
134156
)
135157
);
136158
} else {
@@ -148,10 +170,13 @@ function plotBoxAndWhiskers(sel, axes, trace, t, isStatic) {
148170
''
149171
) + // notched left edge
150172
'Z' + // end of the box
151-
'M' + posc + ',' + q1 + 'V' + lf + 'M' + posc + ',' + q3 + 'V' + uf + // whiskers
152-
(whiskerWidth === 0 ?
153-
'' : // whisker caps
154-
'M' + posw0 + ',' + lf + 'H' + posw1 + 'M' + posw0 + ',' + uf + 'H' + posw1
173+
(!whiskerDisable ?
174+
'M' + posc + ',' + q1 + 'V' + lf + 'M' + posc + ',' + q3 + 'V' + uf + // whiskers
175+
(whiskerWidth === 0 ?
176+
'' : // whisker caps
177+
'M' + posw0 + ',' + lf + 'H' + posw1 + 'M' + posw0 + ',' + uf + 'H' + posw1
178+
) :
179+
''
155180
)
156181
);
157182
}

‎test/image/mocks/box_3sigma.json

+133
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
{
2+
"data": [
3+
{
4+
"y": [
5+
0.4995, 0.3786, 0.5188, 0.4505, 0.5805, 0.5539, 0.7341, 0.3303, 0.6202, 0.4754, 0.4814, 0.6103, 0.5157, 0.3841, 0.6166, 0.4917, 0.5646, 0.4532, 0.5983,
6+
0.5079, 0.5227, 0.5483, 0.3081, 0.5172, 0.4127, 0.3871, 0.4703, 0.5331, 0.4573, 0.6187, 0.5718, 0.4474, 0.5349, 0.4614, 0.3096, 0.4411, 0.7143, 0.5956,
7+
0.5171, 0.5515, 0.4234, 0.4589, 0.4289, 0.417, 0.4229, 0.5039, 0.4726, 0.5382, 0.261, 0.5326, 0.4472, 0.54, 0.4998, 0.5513, 0.3891, 0.4821, 0.5006,
8+
0.4362, 0.4184, 0.3632, 0.5182, 0.5229, 0.5493, 0.507, 0.4528, 0.4836, 0.5009, 0.49, 0.5757, 0.5408, 0.4246, 0.511, 0.5216, 0.3817, 0.4471, 0.4935,
9+
0.5668, 0.3187, 0.3633, 0.5964, 0.637, 0.4701, 0.4292, 0.4921, 0.439, 0.5846, 0.4502, 0.44, 0.3057, 0.4756, 0.4867, 0.502, 0.438, 0.6819, 0.2607,
10+
0.5233, 0.3291, 0.5555, 0.5397, 0.5068
11+
],
12+
"line": {
13+
"color": "#1c9099"
14+
},
15+
"type": "box",
16+
"boxpoints": "all",
17+
"pointpos": 0,
18+
"name": "1-sigma",
19+
"boxmean": "1sigma",
20+
"whiskerdisable": true
21+
},
22+
{
23+
"y": [
24+
0.4995, 0.3786, 0.5188, 0.4505, 0.5805, 0.5539, 0.7341, 0.3303, 0.6202, 0.4754, 0.4814, 0.6103, 0.5157, 0.3841, 0.6166, 0.4917, 0.5646, 0.4532, 0.5983,
25+
0.5079, 0.5227, 0.5483, 0.3081, 0.5172, 0.4127, 0.3871, 0.4703, 0.5331, 0.4573, 0.6187, 0.5718, 0.4474, 0.5349, 0.4614, 0.3096, 0.4411, 0.7143, 0.5956,
26+
0.5171, 0.5515, 0.4234, 0.4589, 0.4289, 0.417, 0.4229, 0.5039, 0.4726, 0.5382, 0.261, 0.5326, 0.4472, 0.54, 0.4998, 0.5513, 0.3891, 0.4821, 0.5006,
27+
0.4362, 0.4184, 0.3632, 0.5182, 0.5229, 0.5493, 0.507, 0.4528, 0.4836, 0.5009, 0.49, 0.5757, 0.5408, 0.4246, 0.511, 0.5216, 0.3817, 0.4471, 0.4935,
28+
0.5668, 0.3187, 0.3633, 0.5964, 0.637, 0.4701, 0.4292, 0.4921, 0.439, 0.5846, 0.4502, 0.44, 0.3057, 0.4756, 0.4867, 0.502, 0.438, 0.6819, 0.2607,
29+
0.5233, 0.3291, 0.5555, 0.5397, 0.5068
30+
],
31+
"line": {
32+
"color": "#1c9099"
33+
},
34+
"boxpoints": "all",
35+
"pointpos": 0,
36+
"type": "box",
37+
"name": "2-sigma",
38+
"boxmean": "2sigma",
39+
"whiskerdisable": true
40+
},
41+
{
42+
"y": [
43+
0.4995, 0.3786, 0.5188, 0.4505, 0.5805, 0.5539, 0.7341, 0.3303, 0.6202, 0.4754, 0.4814, 0.6103, 0.5157, 0.3841, 0.6166, 0.4917, 0.5646, 0.4532, 0.5983,
44+
0.5079, 0.5227, 0.5483, 0.3081, 0.5172, 0.4127, 0.3871, 0.4703, 0.5331, 0.4573, 0.6187, 0.5718, 0.4474, 0.5349, 0.4614, 0.3096, 0.4411, 0.7143, 0.5956,
45+
0.5171, 0.5515, 0.4234, 0.4589, 0.4289, 0.417, 0.4229, 0.5039, 0.4726, 0.5382, 0.261, 0.5326, 0.4472, 0.54, 0.4998, 0.5513, 0.3891, 0.4821, 0.5006,
46+
0.4362, 0.4184, 0.3632, 0.5182, 0.5229, 0.5493, 0.507, 0.4528, 0.4836, 0.5009, 0.49, 0.5757, 0.5408, 0.4246, 0.511, 0.5216, 0.3817, 0.4471, 0.4935,
47+
0.5668, 0.3187, 0.3633, 0.5964, 0.637, 0.4701, 0.4292, 0.4921, 0.439, 0.5846, 0.4502, 0.44, 0.3057, 0.4756, 0.4867, 0.502, 0.438, 0.6819, 0.2607,
48+
0.5233, 0.3291, 0.5555, 0.5397, 0.5068
49+
],
50+
"line": {
51+
"color": "#1c9099"
52+
},
53+
"type": "box",
54+
"boxpoints": "all",
55+
"pointpos": 0,
56+
"name": "3-sigma",
57+
"boxmean": "3sigma",
58+
"whiskerdisable": true
59+
},
60+
{
61+
"y": [
62+
0.4995, 0.3786, 0.5188, 0.4505, 0.5805, 0.5539, 0.7341, 0.3303, 0.6202, 0.4754, 0.4814, 0.6103, 0.5157, 0.3841, 0.6166, 0.4917, 0.5646, 0.4532, 0.5983,
63+
0.5079, 0.5227, 0.5483, 0.3081, 0.5172, 0.4127, 0.3871, 0.4703, 0.5331, 0.4573, 0.6187, 0.5718, 0.4474, 0.5349, 0.4614, 0.3096, 0.4411, 0.7143, 0.5956,
64+
0.5171, 0.5515, 0.4234, 0.4589, 0.4289, 0.417, 0.4229, 0.5039, 0.4726, 0.5382, 0.261, 0.5326, 0.4472, 0.54, 0.4998, 0.5513, 0.3891, 0.4821, 0.5006,
65+
0.4362, 0.4184, 0.3632, 0.5182, 0.5229, 0.5493, 0.507, 0.4528, 0.4836, 0.5009, 0.49, 0.5757, 0.5408, 0.4246, 0.511, 0.5216, 0.3817, 0.4471, 0.4935,
66+
0.5668, 0.3187, 0.3633, 0.5964, 0.637, 0.4701, 0.4292, 0.4921, 0.439, 0.5846, 0.4502, 0.44, 0.3057, 0.4756, 0.4867, 0.502, 0.438, 0.6819, 0.2607,
67+
0.5233, 0.3291, 0.5555, 0.5397, 0.5068
68+
],
69+
"line": {
70+
"color": "#1c9099"
71+
},
72+
"type": "box",
73+
"boxpoints": "all",
74+
"pointpos": 0,
75+
"name": "4-sigma",
76+
"boxmean": "4sigma",
77+
"whiskerdisable": true
78+
},
79+
{
80+
"y": [
81+
0.4995, 0.3786, 0.5188, 0.4505, 0.5805, 0.5539, 0.7341, 0.3303, 0.6202, 0.4754, 0.4814, 0.6103, 0.5157, 0.3841, 0.6166, 0.4917, 0.5646, 0.4532, 0.5983,
82+
0.5079, 0.5227, 0.5483, 0.3081, 0.5172, 0.4127, 0.3871, 0.4703, 0.5331, 0.4573, 0.6187, 0.5718, 0.4474, 0.5349, 0.4614, 0.3096, 0.4411, 0.7143, 0.5956,
83+
0.5171, 0.5515, 0.4234, 0.4589, 0.4289, 0.417, 0.4229, 0.5039, 0.4726, 0.5382, 0.261, 0.5326, 0.4472, 0.54, 0.4998, 0.5513, 0.3891, 0.4821, 0.5006,
84+
0.4362, 0.4184, 0.3632, 0.5182, 0.5229, 0.5493, 0.507, 0.4528, 0.4836, 0.5009, 0.49, 0.5757, 0.5408, 0.4246, 0.511, 0.5216, 0.3817, 0.4471, 0.4935,
85+
0.5668, 0.3187, 0.3633, 0.5964, 0.637, 0.4701, 0.4292, 0.4921, 0.439, 0.5846, 0.4502, 0.44, 0.3057, 0.4756, 0.4867, 0.502, 0.438, 0.6819, 0.2607,
86+
0.5233, 0.3291, 0.5555, 0.5397, 0.5068
87+
],
88+
"line": {
89+
"color": "#1c9099"
90+
},
91+
"boxpoints": "all",
92+
"pointpos": 0,
93+
"type": "box",
94+
"name": "5-sigma",
95+
"boxmean": "5sigma",
96+
"whiskerdisable": true
97+
},
98+
{
99+
"y": [
100+
0.4995, 0.3786, 0.5188, 0.4505, 0.5805, 0.5539, 0.7341, 0.3303, 0.6202, 0.4754, 0.4814, 0.6103, 0.5157, 0.3841, 0.6166, 0.4917, 0.5646, 0.4532, 0.5983,
101+
0.5079, 0.5227, 0.5483, 0.3081, 0.5172, 0.4127, 0.3871, 0.4703, 0.5331, 0.4573, 0.6187, 0.5718, 0.4474, 0.5349, 0.4614, 0.3096, 0.4411, 0.7143, 0.5956,
102+
0.5171, 0.5515, 0.4234, 0.4589, 0.4289, 0.417, 0.4229, 0.5039, 0.4726, 0.5382, 0.261, 0.5326, 0.4472, 0.54, 0.4998, 0.5513, 0.3891, 0.4821, 0.5006,
103+
0.4362, 0.4184, 0.3632, 0.5182, 0.5229, 0.5493, 0.507, 0.4528, 0.4836, 0.5009, 0.49, 0.5757, 0.5408, 0.4246, 0.511, 0.5216, 0.3817, 0.4471, 0.4935,
104+
0.5668, 0.3187, 0.3633, 0.5964, 0.637, 0.4701, 0.4292, 0.4921, 0.439, 0.5846, 0.4502, 0.44, 0.3057, 0.4756, 0.4867, 0.502, 0.438, 0.6819, 0.2607,
105+
0.5233, 0.3291, 0.5555, 0.5397, 0.5068
106+
],
107+
"line": {
108+
"color": "#1c9099"
109+
},
110+
"boxpoints": "all",
111+
"pointpos": 0,
112+
"type": "box",
113+
"name": "6-sigma",
114+
"boxmean": "6sigma",
115+
"whiskerdisable": true
116+
}
117+
],
118+
"layout": {
119+
"showlegend": false,
120+
"yaxis": {
121+
"title": { "text": "Random Variable" },
122+
"type": "linear",
123+
"range":[-0.2, 1.2]
124+
},
125+
"title": { "text": "Box plots drawn on std deviation instead of quartiles" },
126+
"xaxis": {
127+
"type": "category"
128+
},
129+
"height": 598,
130+
"width": 1080,
131+
"autosize": true
132+
}
133+
}

‎test/plot-schema.json

+13-1
Original file line numberDiff line numberDiff line change
@@ -15607,12 +15607,18 @@
1560715607
"valType": "string"
1560815608
},
1560915609
"boxmean": {
15610-
"description": "If *true*, the mean of the box(es)' underlying distribution is drawn as a dashed line inside the box(es). If *sd* the standard deviation is also drawn. Defaults to *true* when `mean` is set. Defaults to *sd* when `sd` is set Otherwise defaults to *false*.",
15610+
"description": "If *true*, the mean of the box(es)' underlying distribution is drawn as a dashed line inside the box(es). If *sd* the standard deviation is also drawn. If 1sigma the box is drawn between mean+-sigma, instead of median+-quartile 1sigma, 2sigma, ... , 6sigma are availabe Defaults to *true* when `mean` is set. Defaults to *sd* when `sd` is set Otherwise defaults to *false*.",
1561115611
"editType": "calc",
1561215612
"valType": "enumerated",
1561315613
"values": [
1561415614
true,
1561515615
"sd",
15616+
"1sigma",
15617+
"2sigma",
15618+
"3sigma",
15619+
"4sigma",
15620+
"5sigma",
15621+
"6sigma",
1561615622
false
1561715623
]
1561815624
},
@@ -16735,6 +16741,12 @@
1673516741
"legendonly"
1673616742
]
1673716743
},
16744+
"whiskerdisable": {
16745+
"description": "Determines whether or not whiskers are visible",
16746+
"dflt": false,
16747+
"editType": "calc",
16748+
"valType": "boolean"
16749+
},
1673816750
"whiskerwidth": {
1673916751
"description": "Sets the width of the whiskers relative to the box' width. For example, with 1, the whiskers are as wide as the box(es).",
1674016752
"dflt": 0.5,

0 commit comments

Comments
 (0)