Skip to content

Commit 80468be

Browse files
authored
Merge pull request #605 from plotly/3d-fixes
3d trace types - feature parity
2 parents 1919f50 + e83c35c commit 80468be

17 files changed

+310
-191
lines changed

src/DefaultEditor.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,10 +29,10 @@ class DefaultEditor extends Component {
2929
<GraphTransformsPanel group={_('Graph')} name={_('Transforms')} />
3030
<StyleTracesPanel group={_('Style')} name={_('Traces')} />
3131
<StyleLayoutPanel group={_('Style')} name={_('Layout')} />
32-
<StyleNotesPanel group={_('Style')} name={_('Notes')} />
3332
<StyleAxesPanel group={_('Style')} name={_('Axes')} />
3433
<StyleLegendPanel group={_('Style')} name={_('Legend')} />
3534
<StyleColorbarsPanel group={_('Style')} name={_('Color Bars')} />
35+
<StyleNotesPanel group={_('Style')} name={_('Annotations')} />
3636
<StyleShapesPanel group={_('Style')} name={_('Shapes')} />
3737
<StyleImagesPanel group={_('Style')} name={_('Images')} />
3838
<StyleSlidersPanel group={_('Style')} name={_('Sliders')} />

src/components/fields/CanvasSize.js

Lines changed: 0 additions & 98 deletions
This file was deleted.
Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
33
import React, {Component} from 'react';
44
import nestedProperty from 'plotly.js/src/lib/nested_property';
55
import {tooLight} from 'lib';
6-
import {COLORS} from 'lib/constants';
6+
import {COLORS, MULTI_VALUED} from 'lib/constants';
77

88
/* eslint-disable react/prop-types */
99
const styledRenderer = ({label}) => {
@@ -37,9 +37,19 @@ const strokeShapes = [
3737

3838
const strokeStyle = {fill: 'none', strokeWidth: '4px'};
3939

40-
const computeOptions = (strokeData, stroke = COLORS.mutedBlue) =>
40+
const computeOptions = (strokeData, stroke) =>
4141
strokeData.map(({value, strokeDasharray, d = 'M0,8h100'}) => ({
42-
label: <path d={d} style={{...strokeStyle, stroke, strokeDasharray}} />,
42+
label: (
43+
<path
44+
d={d}
45+
style={{
46+
...strokeStyle,
47+
stroke:
48+
!stroke || stroke === MULTI_VALUED ? COLORS.mutedBlue : stroke,
49+
strokeDasharray,
50+
}}
51+
/>
52+
),
4353
value,
4454
}));
4555

src/components/fields/MarkerColor.js

Lines changed: 69 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,14 @@
11
import Field from './Field';
22
import PropTypes from 'prop-types';
3-
import React, {Component} from 'react';
3+
import React, {Component, Fragment} from 'react';
44
import {connectToContainer} from 'lib';
55
import RadioBlocks from '../widgets/RadioBlocks';
66
import Color from './Color';
7-
import DataSelector from './DataSelector';
87
import Colorscale from './Colorscale';
8+
import Numeric from './Numeric';
9+
import Radio from './Radio';
10+
import DataSelector from './DataSelector';
11+
import VisibilitySelect from './VisibilitySelect';
912
import {MULTI_VALUED, COLORS} from 'lib/constants';
1013

1114
class UnconnectedMarkerColor extends Component {
@@ -93,35 +96,72 @@ class UnconnectedMarkerColor extends Component {
9396
container.marker.color.includes(MULTI_VALUED));
9497

9598
return (
96-
<Field {...this.props} multiValued={multiValued} attr={attr}>
97-
<RadioBlocks
98-
options={options}
99-
activeOption={type}
100-
onOptionChange={this.setType}
101-
/>
102-
{!type ? null : type === 'constant' ? (
103-
<Color
104-
suppressMultiValuedMessage
105-
attr="marker.color"
106-
updatePlot={this.setValue}
107-
fullValue={value.constant}
99+
<Fragment>
100+
<Field {...this.props} multiValued={multiValued} attr={attr}>
101+
<RadioBlocks
102+
options={options}
103+
activeOption={type}
104+
onOptionChange={this.setType}
108105
/>
109-
) : container.marker &&
110-
container.marker.colorsrc === MULTI_VALUED ? null : (
111-
<div>
112-
<DataSelector suppressMultiValuedMessage attr="marker.color" />
113-
{container.marker &&
114-
container.marker.colorscale === MULTI_VALUED ? null : (
115-
<Colorscale
116-
suppressMultiValuedMessage
117-
attr="marker.colorscale"
118-
updatePlot={this.setColorScale}
119-
colorscale={colorscale}
120-
/>
121-
)}
122-
</div>
106+
{!type ? null : type === 'constant' ? (
107+
<Color
108+
suppressMultiValuedMessage
109+
attr="marker.color"
110+
updatePlot={this.setValue}
111+
fullValue={value.constant}
112+
/>
113+
) : container.marker &&
114+
container.marker.colorsrc === MULTI_VALUED ? null : (
115+
<Fragment>
116+
<DataSelector suppressMultiValuedMessage attr="marker.color" />
117+
{container.marker &&
118+
container.marker.colorscale === MULTI_VALUED ? null : (
119+
<Colorscale
120+
suppressMultiValuedMessage
121+
attr="marker.colorscale"
122+
updatePlot={this.setColorScale}
123+
colorscale={colorscale}
124+
/>
125+
)}
126+
</Fragment>
127+
)}
128+
</Field>
129+
{type === 'constant' ? (
130+
''
131+
) : (
132+
<Fragment>
133+
<Radio
134+
label={_('Colorscale Direction')}
135+
attr="marker.reversescale"
136+
options={[
137+
{label: _('Normal'), value: false},
138+
{label: _('Reversed'), value: true},
139+
]}
140+
/>
141+
<Radio
142+
label={_('Color Bar')}
143+
attr="marker.showscale"
144+
options={[
145+
{label: _('Show'), value: true},
146+
{label: _('Hide'), value: false},
147+
]}
148+
/>
149+
<VisibilitySelect
150+
label={_('Colorscale Range')}
151+
attr="marker.cauto"
152+
options={[
153+
{label: _('Auto'), value: true},
154+
{label: _('Custom'), value: false},
155+
]}
156+
showOn={false}
157+
dafault={true}
158+
>
159+
<Numeric label={_('Min')} attr="marker.cmin" />
160+
<Numeric label={_('Max')} attr="marker.cmax" />
161+
</VisibilitySelect>
162+
</Fragment>
123163
)}
124-
</Field>
164+
</Fragment>
125165
);
126166
}
127167
}
Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
import React, {Fragment, Component} from 'react';
2+
import PropTypes from 'prop-types';
3+
import {connectToContainer} from 'lib';
4+
import Field from './Field';
5+
import Radio from './Radio';
6+
import Dropdown from './Dropdown';
7+
import nestedProperty from 'plotly.js/src/lib/nested_property';
8+
9+
class UnconnectedVisibilitySelect extends Component {
10+
constructor(props, context) {
11+
super(props, context);
12+
13+
const value = nestedProperty(props.container, props.attr).get();
14+
this.state = {
15+
mode: value === undefined ? this.props.defaultOpt : value, // eslint-disable-line no-undefined
16+
};
17+
18+
this.setMode = this.setMode.bind(this);
19+
}
20+
21+
setMode(mode) {
22+
this.setState({mode: mode});
23+
this.props.updateContainer({[this.props.attr]: mode});
24+
}
25+
26+
render() {
27+
const {dropdown, clearable, options, showOn, attr, label} = this.props;
28+
const {mode} = this.state;
29+
30+
return (
31+
<Fragment>
32+
{dropdown ? (
33+
<Dropdown
34+
attr={attr}
35+
label={label}
36+
options={options}
37+
fullValue={mode}
38+
updatePlot={this.setMode}
39+
clearable={clearable}
40+
/>
41+
) : (
42+
<Radio
43+
attr={attr}
44+
label={label}
45+
options={options}
46+
fullValue={mode}
47+
updatePlot={this.setMode}
48+
/>
49+
)}
50+
{mode !== showOn ? '' : this.props.children}
51+
</Fragment>
52+
);
53+
}
54+
}
55+
56+
UnconnectedVisibilitySelect.propTypes = {
57+
fullValue: PropTypes.any,
58+
updatePlot: PropTypes.func,
59+
dropdown: PropTypes.bool,
60+
clearable: PropTypes.bool,
61+
showOn: PropTypes.oneOfType([
62+
PropTypes.number,
63+
PropTypes.bool,
64+
PropTypes.string,
65+
]),
66+
defaultOpt: PropTypes.oneOfType([
67+
PropTypes.number,
68+
PropTypes.bool,
69+
PropTypes.string,
70+
]),
71+
label: PropTypes.string,
72+
attr: PropTypes.string,
73+
...Field.propTypes,
74+
};
75+
76+
UnconnectedVisibilitySelect.contextTypes = {
77+
updateContainer: PropTypes.func,
78+
};
79+
80+
export default connectToContainer(UnconnectedVisibilitySelect);

0 commit comments

Comments
 (0)