Split `EditorControls` and `PlotComponent` components [question]

[ghost]

Hello guys !

I'm currently trying to build a plugin using your react-chart-editor. I wish to split the EditorControls and the PlotComponent components (in two different HTML pages, using localStorage or some sort of communication mecanism between the two, to be precise).

It is very easy to only render the PlotComponent component with PlotltEditor's hideControls attribute. However, I'm having a hard time to only render the EditorControls component alone, without rendering the graphDiv. I'd rather avoid doing a dirty display: none; on the div.plotly_editor_plot for obvious performance reasons.

Do you have any insights on this issue of mine ? I hope I'm clear enough. Any help would be greatly appreciated ! : )

[nicolaskruchten]

Hi,

That's a good question, but unfortunately will be impossible or very difficult to accomplish. The reason is that the system operates in a loop where the figure renders and the controls configure themselves based on the rendered figure, and then the user changes a control, which rerenders the figure, which reconfigures the controls and so on. In this way, the majority of the logic for the editor (i.e. which controls should show up when, populated with what values etc) is actually in plotly.js, communicated via a rendered figure. Because of this, you may even find problems with display: none;, as plotly.js interacts with browser APIs for sizing of various elements etc, but you'll have to experiment with it to see how far you get :)

[ghost]

Thank you very much for you super fast reply Nicolas !

Your clear explanation confirms my concern. Therefore, I drop the splitting idea and I'll see if I can achieve what I'm looking for with some css.

Keep up the good work :)

(I'm closing the issue)