Fix mol image bug

app.py

@@ -637,17 +637,19 @@ def Optimize_a_molecule():
                                     com_col = st.columns(3)
                                     com_col[1].markdown("<h4 style='text-align: center;'>Original</h4>",unsafe_allow_html=True)
                                     com_col[2].markdown("<h4 style='text-align: center;'>New</h4>",unsafe_allow_html=True)
+                                    old_mol = Chem.MolFromSmiles(st.session_state.canon_smiles)
+                                    new_mol = Chem.MolFromSmiles(st.session_state.new_smiles)
                                     imgByteArr.seek(0)
-                                    MolToImage(Chem.MolFromSmiles(st.session_state.canon_smiles),size=(200,200)).save(imgByteArr,format='PNG')
-                                    old_mol = base64.b64encode(imgByteArr.getvalue()).decode()
+                                    MolToImage(old_mol,size=(200,200)).save(imgByteArr,format='PNG')
+                                    old_mol_base64 = base64.b64encode(imgByteArr.getvalue()).decode()
                                     imgByteArr.seek(0)
-                                    MolToImage(Chem.MolFromSmiles(st.session_state.new_smiles),size=(200,200)).save(imgByteArr,format='PNG')
-                                    new_mol = base64.b64encode(imgByteArr.getvalue()).decode()
+                                    MolToImage(new_mol,size=(200,200)).save(imgByteArr,format='PNG')
+                                    new_mol_base64 = base64.b64encode(imgByteArr.getvalue()).decode()
                                     com_col[1].markdown("<p style='text-align: center;'>"+
-                                        f"<img src='data:image/png;base64,{old_mol}' class='img-fluid'>"+
+                                        f"<img src='data:image/png;base64,{old_mol_base64}' class='img-fluid'>"+
                                         "</p>", unsafe_allow_html=True)
                                     com_col[2].markdown("<p style='text-align: center;'>"+
-                                        f"<img src='data:image/png;base64,{new_mol}' class='img-fluid'>"+
+                                        f"<img src='data:image/png;base64,{new_mol_base64}' class='img-fluid'>"+
                                         "</p>", unsafe_allow_html=True)
                                     old_mol_metrics = Metrics(st.session_state.canon_smiles).calculate_all()
                                     new_mol_metrics = Metrics(st.session_state.new_smiles).calculate_all()
@@ -706,7 +708,7 @@ def Optimize_a_molecule():
                                                     drawer = rdMolDraw2D.MolDraw2DSVG(200,200)
                                                     # drawer.drawOptions().fillHighlights = False
                                                     matches = sum(patt, ())
-                                                    drawer.DrawMolecule(mol, highlightAtoms=matches)
+                                                    drawer.DrawMolecule(old_mol, highlightAtoms=matches)
                                                     drawer.FinishDrawing()
                                                     svg = drawer.GetDrawingText()
                                                     imgByteArr.seek(0)
@@ -727,7 +729,7 @@ def Optimize_a_molecule():
                                                     drawer = rdMolDraw2D.MolDraw2DSVG(200,200)
                                                     # drawer.drawOptions().fillHighlights = False
                                                     matches = sum(patt, ())
-                                                    drawer.DrawMolecule(mol, highlightAtoms=matches)
+                                                    drawer.DrawMolecule(new_mol, highlightAtoms=matches)
                                                     drawer.FinishDrawing()
                                                     svg = drawer.GetDrawingText()
                                                     imgByteArr.seek(0)