diff --git a/src/actions/loadData.js b/src/actions/loadData.js
index 74f1599a3..880b33e54 100644
--- a/src/actions/loadData.js
+++ b/src/actions/loadData.js
@@ -10,6 +10,7 @@ import { parseMarkdownNarrativeFile } from "../util/parseNarrative";
 import { NoContentError } from "../util/exceptions";
 import { parseMarkdown } from "../util/parseMarkdown";
 import { updateColorByWithRootSequenceData } from "../actions/colors";
+import { explodeTree } from "./tree";
 
 export function getDatasetNamesFromUrl(url) {
   let secondTreeUrl;
@@ -41,6 +42,12 @@ export const loadSecondTree = (secondTreeUrl, firstTreeUrl) => async (dispatch,
   }
 
   const oldState = getState();
+
+  /* if the first tree is exploded, then reconstruct it before loading a second tree */
+  if (oldState.controls.explodeAttr) {
+    dispatch(explodeTree(undefined));
+  }
+
   const newState = createTreeTooState({treeTooJSON: secondJson.tree, oldState, originalTreeUrl: firstTreeUrl, secondTreeUrl: secondTreeUrl, dispatch});
   dispatch({type: types.TREE_TOO_DATA, ...newState});
 };
diff --git a/src/components/controls/choose-explode-attr.js b/src/components/controls/choose-explode-attr.js
index f3db9cc53..b01781e62 100644
--- a/src/components/controls/choose-explode-attr.js
+++ b/src/components/controls/choose-explode-attr.js
@@ -13,7 +13,8 @@ import { controlsWidth } from "../../util/globals";
  */
 @connect((state) => ({
   selected: state.controls.explodeAttr,
-  available: state.metadata.colorings
+  available: state.metadata.colorings,
+  showThisUI: !state.controls.showTreeToo
 }))
 class ChooseExplodeAttr extends React.Component {
   constructor(props) {
@@ -31,6 +32,7 @@ class ChooseExplodeAttr extends React.Component {
     return options;
   }
   render() {
+    if (!this.props.showThisUI) return null;
     const { t } = this.props;
     return (
       <div style={{paddingTop: 5}}>