Skip to content

Commit 4a7dee5

Browse files
committed
react to config changes
1 parent 021289c commit 4a7dee5

File tree

1 file changed

+108
-104
lines changed

1 file changed

+108
-104
lines changed

src/plot_api/plot_api.js

Lines changed: 108 additions & 104 deletions
Original file line numberDiff line numberDiff line change
@@ -2615,122 +2615,126 @@ function react(gd, data, layout, config) {
26152615
configChanged = diffConfig(oldConfig, gd._context);
26162616
}
26172617

2618-
gd.data = data || [];
2619-
helpers.cleanData(gd.data);
2620-
gd.layout = layout || {};
2621-
helpers.cleanLayout(gd.layout);
2622-
2623-
applyUIRevisions(gd.data, gd.layout, oldFullData, oldFullLayout);
2624-
2625-
// "true" skips updating calcdata and remapping arrays from calcTransforms,
2626-
// which supplyDefaults usually does at the end, but we may need to NOT do
2627-
// if the diff (which we haven't determined yet) says we'll recalc
2628-
Plots.supplyDefaults(gd, {skipUpdateCalc: true});
2629-
2630-
var newFullData = gd._fullData;
2631-
var newFullLayout = gd._fullLayout;
2632-
var immutable = newFullLayout.datarevision === undefined;
2633-
var transition = newFullLayout.transition;
2634-
2635-
var relayoutFlags = diffLayout(gd, oldFullLayout, newFullLayout, immutable, transition);
2636-
var newDataRevision = relayoutFlags.newDataRevision;
2637-
var restyleFlags = diffData(gd, oldFullData, newFullData, immutable, transition, newDataRevision);
2638-
2639-
// TODO: how to translate this part of relayout to Plotly.react?
2640-
// // Setting width or height to null must reset the graph's width / height
2641-
// // back to its initial value as computed during the first pass in Plots.plotAutoSize.
2642-
// //
2643-
// // To do so, we must manually set them back here using the _initialAutoSize cache.
2644-
// if(['width', 'height'].indexOf(ai) !== -1 && vi === null) {
2645-
// fullLayout[ai] = gd._initialAutoSize[ai];
2646-
// }
2647-
2648-
if(updateAutosize(gd)) relayoutFlags.layoutReplot = true;
2649-
2650-
// clear calcdata and empty categories if required
2651-
if(restyleFlags.calc || relayoutFlags.calc) {
2652-
gd.calcdata = undefined;
2653-
var allNames = Object.getOwnPropertyNames(newFullLayout);
2654-
for(var q = 0; q < allNames.length; q++) {
2655-
var name = allNames[q];
2656-
var start = name.substring(0, 5);
2657-
if(start === 'xaxis' || start === 'yaxis') {
2658-
var emptyCategories = newFullLayout[name]._emptyCategories;
2659-
if(emptyCategories) emptyCategories();
2618+
if(configChanged) {
2619+
plotDone = exports.newPlot(gd, data, layout, config);
2620+
} else {
2621+
gd.data = data || [];
2622+
helpers.cleanData(gd.data);
2623+
gd.layout = layout || {};
2624+
helpers.cleanLayout(gd.layout);
2625+
2626+
applyUIRevisions(gd.data, gd.layout, oldFullData, oldFullLayout);
2627+
2628+
// "true" skips updating calcdata and remapping arrays from calcTransforms,
2629+
// which supplyDefaults usually does at the end, but we may need to NOT do
2630+
// if the diff (which we haven't determined yet) says we'll recalc
2631+
Plots.supplyDefaults(gd, {skipUpdateCalc: true});
2632+
2633+
var newFullData = gd._fullData;
2634+
var newFullLayout = gd._fullLayout;
2635+
var immutable = newFullLayout.datarevision === undefined;
2636+
var transition = newFullLayout.transition;
2637+
2638+
var relayoutFlags = diffLayout(gd, oldFullLayout, newFullLayout, immutable, transition);
2639+
var newDataRevision = relayoutFlags.newDataRevision;
2640+
var restyleFlags = diffData(gd, oldFullData, newFullData, immutable, transition, newDataRevision);
2641+
2642+
// TODO: how to translate this part of relayout to Plotly.react?
2643+
// // Setting width or height to null must reset the graph's width / height
2644+
// // back to its initial value as computed during the first pass in Plots.plotAutoSize.
2645+
// //
2646+
// // To do so, we must manually set them back here using the _initialAutoSize cache.
2647+
// if(['width', 'height'].indexOf(ai) !== -1 && vi === null) {
2648+
// fullLayout[ai] = gd._initialAutoSize[ai];
2649+
// }
2650+
2651+
if(updateAutosize(gd)) relayoutFlags.layoutReplot = true;
2652+
2653+
// clear calcdata and empty categories if required
2654+
if(restyleFlags.calc || relayoutFlags.calc) {
2655+
gd.calcdata = undefined;
2656+
var allNames = Object.getOwnPropertyNames(newFullLayout);
2657+
for(var q = 0; q < allNames.length; q++) {
2658+
var name = allNames[q];
2659+
var start = name.substring(0, 5);
2660+
if(start === 'xaxis' || start === 'yaxis') {
2661+
var emptyCategories = newFullLayout[name]._emptyCategories;
2662+
if(emptyCategories) emptyCategories();
2663+
}
26602664
}
2665+
// otherwise do the calcdata updates and calcTransform array remaps that we skipped earlier
2666+
} else {
2667+
Plots.supplyDefaultsUpdateCalc(gd.calcdata, newFullData);
26612668
}
2662-
// otherwise do the calcdata updates and calcTransform array remaps that we skipped earlier
2663-
} else {
2664-
Plots.supplyDefaultsUpdateCalc(gd.calcdata, newFullData);
2665-
}
26662669

2667-
// Note: what restyle/relayout use impliedEdits and clearAxisTypes for
2668-
// must be handled by the user when using Plotly.react.
2670+
// Note: what restyle/relayout use impliedEdits and clearAxisTypes for
2671+
// must be handled by the user when using Plotly.react.
26692672

2670-
// fill in redraw sequence
2671-
var seq = [];
2673+
// fill in redraw sequence
2674+
var seq = [];
26722675

2673-
if(frames) {
2674-
gd._transitionData = {};
2675-
Plots.createTransitionData(gd);
2676-
seq.push(addFrames);
2677-
}
2676+
if(frames) {
2677+
gd._transitionData = {};
2678+
Plots.createTransitionData(gd);
2679+
seq.push(addFrames);
2680+
}
26782681

2679-
// Transition pathway,
2680-
// only used when 'transition' is set by user and
2681-
// when at least one animatable attribute has changed,
2682-
// N.B. config changed aren't animatable
2683-
if(newFullLayout.transition && !configChanged && (restyleFlags.anim || relayoutFlags.anim)) {
2684-
if(relayoutFlags.ticks) seq.push(subroutines.doTicksRelayout);
2682+
// Transition pathway,
2683+
// only used when 'transition' is set by user and
2684+
// when at least one animatable attribute has changed,
2685+
// N.B. config changed aren't animatable
2686+
if(newFullLayout.transition && !configChanged && (restyleFlags.anim || relayoutFlags.anim)) {
2687+
if(relayoutFlags.ticks) seq.push(subroutines.doTicksRelayout);
26852688

2686-
Plots.doCalcdata(gd);
2687-
subroutines.doAutoRangeAndConstraints(gd);
2689+
Plots.doCalcdata(gd);
2690+
subroutines.doAutoRangeAndConstraints(gd);
26882691

2689-
seq.push(function() {
2690-
return Plots.transitionFromReact(gd, restyleFlags, relayoutFlags, oldFullLayout);
2691-
});
2692-
} else if(restyleFlags.fullReplot || relayoutFlags.layoutReplot || configChanged) {
2693-
gd._fullLayout._skipDefaults = true;
2694-
seq.push(exports._doPlot);
2695-
} else {
2696-
for(var componentType in relayoutFlags.arrays) {
2697-
var indices = relayoutFlags.arrays[componentType];
2698-
if(indices.length) {
2699-
var drawOne = Registry.getComponentMethod(componentType, 'drawOne');
2700-
if(drawOne !== Lib.noop) {
2701-
for(var i = 0; i < indices.length; i++) {
2702-
drawOne(gd, indices[i]);
2703-
}
2704-
} else {
2705-
var draw = Registry.getComponentMethod(componentType, 'draw');
2706-
if(draw === Lib.noop) {
2707-
throw new Error('cannot draw components: ' + componentType);
2692+
seq.push(function() {
2693+
return Plots.transitionFromReact(gd, restyleFlags, relayoutFlags, oldFullLayout);
2694+
});
2695+
} else if(restyleFlags.fullReplot || relayoutFlags.layoutReplot || configChanged) {
2696+
gd._fullLayout._skipDefaults = true;
2697+
seq.push(exports._doPlot);
2698+
} else {
2699+
for(var componentType in relayoutFlags.arrays) {
2700+
var indices = relayoutFlags.arrays[componentType];
2701+
if(indices.length) {
2702+
var drawOne = Registry.getComponentMethod(componentType, 'drawOne');
2703+
if(drawOne !== Lib.noop) {
2704+
for(var i = 0; i < indices.length; i++) {
2705+
drawOne(gd, indices[i]);
2706+
}
2707+
} else {
2708+
var draw = Registry.getComponentMethod(componentType, 'draw');
2709+
if(draw === Lib.noop) {
2710+
throw new Error('cannot draw components: ' + componentType);
2711+
}
2712+
draw(gd);
27082713
}
2709-
draw(gd);
27102714
}
27112715
}
2712-
}
27132716

2714-
seq.push(Plots.previousPromises);
2715-
if(restyleFlags.style) seq.push(subroutines.doTraceStyle);
2716-
if(restyleFlags.colorbars || relayoutFlags.colorbars) seq.push(subroutines.doColorBars);
2717-
if(relayoutFlags.legend) seq.push(subroutines.doLegend);
2718-
if(relayoutFlags.layoutstyle) seq.push(subroutines.layoutStyles);
2719-
if(relayoutFlags.axrange) addAxRangeSequence(seq);
2720-
if(relayoutFlags.ticks) seq.push(subroutines.doTicksRelayout);
2721-
if(relayoutFlags.modebar) seq.push(subroutines.doModeBar);
2722-
if(relayoutFlags.camera) seq.push(subroutines.doCamera);
2723-
seq.push(emitAfterPlot);
2724-
}
2717+
seq.push(Plots.previousPromises);
2718+
if(restyleFlags.style) seq.push(subroutines.doTraceStyle);
2719+
if(restyleFlags.colorbars || relayoutFlags.colorbars) seq.push(subroutines.doColorBars);
2720+
if(relayoutFlags.legend) seq.push(subroutines.doLegend);
2721+
if(relayoutFlags.layoutstyle) seq.push(subroutines.layoutStyles);
2722+
if(relayoutFlags.axrange) addAxRangeSequence(seq);
2723+
if(relayoutFlags.ticks) seq.push(subroutines.doTicksRelayout);
2724+
if(relayoutFlags.modebar) seq.push(subroutines.doModeBar);
2725+
if(relayoutFlags.camera) seq.push(subroutines.doCamera);
2726+
seq.push(emitAfterPlot);
2727+
}
27252728

2726-
seq.push(
2727-
Plots.rehover,
2728-
Plots.redrag,
2729-
Plots.reselect
2730-
);
2729+
seq.push(
2730+
Plots.rehover,
2731+
Plots.redrag,
2732+
Plots.reselect
2733+
);
27312734

2732-
plotDone = Lib.syncOrAsync(seq, gd);
2733-
if(!plotDone || !plotDone.then) plotDone = Promise.resolve(gd);
2735+
plotDone = Lib.syncOrAsync(seq, gd);
2736+
if(!plotDone || !plotDone.then) plotDone = Promise.resolve(gd);
2737+
}
27342738
}
27352739

27362740
return plotDone.then(function() {
@@ -3675,11 +3679,11 @@ function makePlotFramework(gd) {
36753679
// The plot container should always take the full with the height of its
36763680
// parent (the graph div). This ensures that for responsive plots
36773681
// without a height or width set, the paper div will take up the full
3678-
// height & width of the graph div.
3682+
// height & width of the graph div.
36793683
// So, for responsive plots without a height or width set, if the plot
36803684
// container's height is left to 'auto', its height will be dictated by
36813685
// its childrens' height. (The plot container's only child is the paper
3682-
// div.)
3686+
// div.)
36833687
// In this scenario, the paper div's height will be set to 100%,
36843688
// which will be 100% of the plot container's auto height. That is
36853689
// meaninglesss, so the browser will use the paper div's children to set

0 commit comments

Comments
 (0)