Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 84a2f7f

Browse files
renaming reshuffle
1 parent f64f93d commit 84a2f7f

File tree

5 files changed

+333
-333
lines changed

5 files changed

+333
-333
lines changed

‎dev/App.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import {hot} from 'react-hot-loader';
33
import plotly from 'plotly.js/dist/plotly';
44
import '../src/styles/main.scss';
55
import Nav from './Nav';
6-
import {PlotlyEditorWithPlot} from '../src';
6+
import PlotlyEditor from '../src';
77

88
// https://github.com/plotly/react-chart-editor#mapbox-access-tokens
99
import ACCESS_TOKENS from '../accessTokens';
@@ -63,7 +63,7 @@ class App extends Component {
6363
render() {
6464
return (
6565
<div className="app__container plotly-editor--theme-provider">
66-
<PlotlyEditorWithPlot
66+
<PlotlyEditor
6767
data={this.state.data}
6868
layout={this.state.layout}
6969
config={config}

‎src/EditorControls.js

Lines changed: 292 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,292 @@
1+
import DefaultEditor from './DefaultEditor';
2+
import PropTypes from 'prop-types';
3+
import React, {Component} from 'react';
4+
import {bem} from './lib';
5+
import {maybeClearAxisTypes} from './shame';
6+
import {EDITOR_ACTIONS} from './lib/constants';
7+
import isNumeric from 'fast-isnumeric';
8+
import nestedProperty from 'plotly.js/src/lib/nested_property';
9+
import {categoryLayout, traceTypes} from 'lib/traceTypes';
10+
import {ModalProvider} from 'components/containers';
11+
12+
class EditorControls extends Component {
13+
constructor(props, context) {
14+
super(props, context);
15+
16+
// we only need to compute this once.
17+
if (this.props.plotly) {
18+
this.plotSchema = this.props.plotly.PlotSchema.get();
19+
}
20+
}
21+
22+
getChildContext() {
23+
const gd = this.props.graphDiv || {};
24+
return {
25+
advancedTraceTypeSelector: this.props.advancedTraceTypeSelector,
26+
config: gd._context,
27+
data: gd.data,
28+
dataSources: this.props.dataSources,
29+
dataSourceOptions: this.props.dataSourceOptions,
30+
dataSourceValueRenderer: this.props.dataSourceValueRenderer,
31+
dataSourceOptionRenderer: this.props.dataSourceOptionRenderer,
32+
dictionaries: this.props.dictionaries || {},
33+
fullData: gd._fullData,
34+
fullLayout: gd._fullLayout,
35+
graphDiv: gd,
36+
layout: gd.layout,
37+
locale: this.props.locale,
38+
onUpdate: this.handleUpdate.bind(this),
39+
plotSchema: this.plotSchema,
40+
plotly: this.props.plotly,
41+
traceTypesConfig: this.props.traceTypesConfig,
42+
};
43+
}
44+
45+
maybeAdjustAxisRef(payload) {
46+
const {graphDiv} = this.props;
47+
if (payload.tracesNeedingAxisAdjustment) {
48+
payload.tracesNeedingAxisAdjustment.forEach(trace => {
49+
const axis = trace[payload.axisAttrToAdjust].charAt(0);
50+
const currentAxisIdNumber = Number(
51+
trace[payload.axisAttrToAdjust].slice(1)
52+
);
53+
const adjustedAxisIdNumber = currentAxisIdNumber - 1;
54+
55+
const currentAxisLayoutProperties = {
56+
...graphDiv.layout[payload.axisAttrToAdjust + currentAxisIdNumber],
57+
};
58+
59+
// for cases when we're adjusting x2 => x, so that it becomes x not x1
60+
graphDiv.data[trace.index][payload.axisAttrToAdjust] =
61+
adjustedAxisIdNumber === 1 ? axis : axis + adjustedAxisIdNumber;
62+
63+
graphDiv.layout[
64+
payload.axisAttrToAdjust + adjustedAxisIdNumber
65+
] = currentAxisLayoutProperties;
66+
});
67+
}
68+
}
69+
70+
handleUpdate({type, payload}) {
71+
const {graphDiv} = this.props;
72+
73+
switch (type) {
74+
case EDITOR_ACTIONS.UPDATE_TRACES:
75+
if (this.props.beforeUpdateTraces) {
76+
this.props.beforeUpdateTraces(payload);
77+
}
78+
79+
// until we start utilizing Plotly.react in `react-plotly.js`
80+
// force clear axes types when a `src` has changed.
81+
maybeClearAxisTypes(graphDiv, payload.traceIndexes, payload.update);
82+
83+
this.maybeAdjustAxisRef(payload);
84+
85+
for (let i = 0; i < payload.traceIndexes.length; i++) {
86+
for (const attr in payload.update) {
87+
const traceIndex = payload.traceIndexes[i];
88+
const prop = nestedProperty(graphDiv.data[traceIndex], attr);
89+
const value = payload.update[attr];
90+
91+
if (value !== void 0) {
92+
prop.set(value);
93+
}
94+
}
95+
}
96+
97+
if (this.props.afterUpdateTraces) {
98+
this.props.afterUpdateTraces(payload);
99+
}
100+
if (this.props.onUpdate) {
101+
this.props.onUpdate(graphDiv.data.slice(), graphDiv.layout);
102+
}
103+
break;
104+
105+
case EDITOR_ACTIONS.UPDATE_LAYOUT:
106+
if (this.props.beforeUpdateLayout) {
107+
this.props.beforeUpdateLayout(payload);
108+
}
109+
for (const attr in payload.update) {
110+
const prop = nestedProperty(graphDiv.layout, attr);
111+
const value = payload.update[attr];
112+
if (value !== void 0) {
113+
prop.set(value);
114+
}
115+
}
116+
if (this.props.afterUpdateLayout) {
117+
this.props.afterUpdateLayout(payload);
118+
}
119+
if (this.props.onUpdate) {
120+
this.props.onUpdate(
121+
graphDiv.data,
122+
Object.assign({}, graphDiv.layout)
123+
);
124+
}
125+
break;
126+
127+
case EDITOR_ACTIONS.ADD_TRACE:
128+
if (this.props.beforeAddTrace) {
129+
this.props.beforeAddTrace(payload);
130+
}
131+
graphDiv.data.push({type: 'scatter', mode: 'markers'});
132+
if (this.props.afterAddTrace) {
133+
this.props.afterAddTrace(payload);
134+
}
135+
if (this.props.onUpdate) {
136+
this.props.onUpdate(graphDiv.data.slice(), graphDiv.layout);
137+
}
138+
break;
139+
140+
case EDITOR_ACTIONS.DELETE_TRACE:
141+
if (payload.traceIndexes && payload.traceIndexes.length) {
142+
if (this.props.beforeDeleteTrace) {
143+
this.props.beforeDeleteTrace(payload);
144+
}
145+
graphDiv.data.splice(payload.traceIndexes[0], 1);
146+
if (this.props.afterDeleteTrace) {
147+
this.props.afterDeleteTrace(payload);
148+
}
149+
if (this.props.onUpdate) {
150+
this.props.onUpdate(graphDiv.data.slice(), graphDiv.layout);
151+
}
152+
}
153+
break;
154+
155+
case EDITOR_ACTIONS.DELETE_ANNOTATION:
156+
if (isNumeric(payload.annotationIndex)) {
157+
if (this.props.beforeDeleteAnnotation) {
158+
this.props.beforeDeleteAnnotation(payload);
159+
}
160+
graphDiv.layout.annotations.splice(payload.annotationIndex, 1);
161+
if (this.props.afterDeleteAnnotation) {
162+
this.props.afterDeleteAnnotation(payload);
163+
}
164+
if (this.props.onUpdate) {
165+
this.props.onUpdate(
166+
graphDiv.data,
167+
Object.assign({}, graphDiv.layout)
168+
);
169+
}
170+
}
171+
break;
172+
173+
case EDITOR_ACTIONS.DELETE_SHAPE:
174+
if (isNumeric(payload.shapeIndex)) {
175+
if (this.props.beforeDeleteShape) {
176+
this.props.beforeDeleteShape(payload);
177+
}
178+
graphDiv.layout.shapes.splice(payload.shapeIndex, 1);
179+
if (this.props.afterDeleteShape) {
180+
this.props.afterDeleteShape(payload);
181+
}
182+
if (this.props.onUpdate) {
183+
this.props.onUpdate(
184+
graphDiv.data,
185+
Object.assign({}, graphDiv.layout)
186+
);
187+
}
188+
}
189+
break;
190+
191+
case EDITOR_ACTIONS.DELETE_IMAGE:
192+
if (isNumeric(payload.imageIndex)) {
193+
if (this.props.beforeDeleteImage) {
194+
this.props.beforeDeleteImage(payload);
195+
}
196+
graphDiv.layout.images.splice(payload.imageIndex, 1);
197+
if (this.props.afterDeleteImage) {
198+
this.props.afterDeleteImage(payload);
199+
}
200+
if (this.props.onUpdate) {
201+
this.props.onUpdate(
202+
graphDiv.data,
203+
Object.assign({}, graphDiv.layout)
204+
);
205+
}
206+
}
207+
break;
208+
209+
default:
210+
throw new Error('must specify an action type to handleEditorUpdate');
211+
}
212+
}
213+
214+
render() {
215+
return (
216+
<div
217+
className={
218+
bem('plotly-editor') +
219+
' plotly-editor--theme-provider' +
220+
`${this.props.className ? ` ${this.props.className}` : ''}`
221+
}
222+
>
223+
<ModalProvider>
224+
{this.props.graphDiv &&
225+
this.props.graphDiv._fullLayout &&
226+
(this.props.children ? this.props.children : <DefaultEditor />)}
227+
</ModalProvider>
228+
</div>
229+
);
230+
}
231+
}
232+
233+
EditorControls.propTypes = {
234+
advancedTraceTypeSelector: PropTypes.bool,
235+
afterAddTrace: PropTypes.func,
236+
afterDeleteAnnotation: PropTypes.func,
237+
afterDeleteShape: PropTypes.func,
238+
afterDeleteImage: PropTypes.func,
239+
afterDeleteTrace: PropTypes.func,
240+
afterUpdateLayout: PropTypes.func,
241+
afterUpdateTraces: PropTypes.func,
242+
beforeAddTrace: PropTypes.func,
243+
beforeDeleteAnnotation: PropTypes.func,
244+
beforeDeleteShape: PropTypes.func,
245+
beforeDeleteImage: PropTypes.func,
246+
beforeDeleteTrace: PropTypes.func,
247+
beforeUpdateLayout: PropTypes.func,
248+
beforeUpdateTraces: PropTypes.func,
249+
children: PropTypes.node,
250+
className: PropTypes.string,
251+
dataSourceOptionRenderer: PropTypes.func,
252+
dataSourceOptions: PropTypes.array,
253+
dataSources: PropTypes.object,
254+
dataSourceValueRenderer: PropTypes.func,
255+
dictionaries: PropTypes.object,
256+
graphDiv: PropTypes.object,
257+
locale: PropTypes.string,
258+
onUpdate: PropTypes.func,
259+
plotly: PropTypes.object,
260+
traceTypesConfig: PropTypes.object,
261+
};
262+
263+
EditorControls.defaultProps = {
264+
locale: 'en',
265+
traceTypesConfig: {
266+
categories: _ => categoryLayout(_),
267+
traces: _ => traceTypes(_),
268+
complex: true,
269+
},
270+
};
271+
272+
EditorControls.childContextTypes = {
273+
advancedTraceTypeSelector: PropTypes.bool,
274+
config: PropTypes.object,
275+
data: PropTypes.array,
276+
dataSourceOptionRenderer: PropTypes.func,
277+
dataSourceOptions: PropTypes.array,
278+
dataSources: PropTypes.object,
279+
dataSourceValueRenderer: PropTypes.func,
280+
dictionaries: PropTypes.object,
281+
fullData: PropTypes.array,
282+
fullLayout: PropTypes.object,
283+
graphDiv: PropTypes.any,
284+
layout: PropTypes.object,
285+
locale: PropTypes.string,
286+
onUpdate: PropTypes.func,
287+
plotly: PropTypes.object,
288+
plotSchema: PropTypes.object,
289+
traceTypesConfig: PropTypes.object,
290+
};
291+
292+
export default EditorControls;

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /