Black Lives Matter. Please consider donating to Black Girls Code today.

Server stays active when running from Wingware IDE, shows only older app

Hi,

This wasn’t happening always. It only started happening when I made a bad move. I copied the entire MathJax folder into assets. I must have broke something. Yes the issue is fixed upon restarting machine.

Let me clarify. The issue is not fixed it’s only fixed for the first app run when the server is initially off. Running the first app after restarting the machine works. But successive runs of other apps doesn’t work. The old code is cached somewhere and gets run.

Why are putting that in assets? Assets is intended for external js/css.

How would I then include “MathJax.js” locally into a Dash app? I thought that MathJax.js would depend on everything nearly in that folder so would have to go with and only with the folder contents.

@EnjoysMath I didn’t realize it was a js library, I just figured it was something math related. That said, I believe you can only put executable files and not folders.

Can you use a bundler like webpack to create a single js file?

@mbkupfer That’s way overkill seeming to me. I could just use the MathJax CDN url:

http://cdn.mathjax.org/mathjax/2.6-latest/MathJax.js

import dash
import dash_html_components as html


# external JavaScript files
external_scripts = [
    "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=default",
]

# external CSS stylesheets
external_stylesheets = [
]


app = dash.Dash(__name__,
                external_scripts=external_scripts,
                external_stylesheets=external_stylesheets)

app.layout = html.Div()

app.css.config.serve_locally = False
app.scripts.config.serve_locally = False

if __name__ == '__main__':
    app.run_server(debug=True)

But I’m still not sure how to place “hidden SVG elements” and render those using the method of this static HTML file:

<html>
<header>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=default"></script>
<script type="text/x-mathjax-config">
    MathJax.Hub.Config({
        extensions: ["tex2jax.js", "TeX/AMSmath.js"],
        jax: ["input/TeX", "output/SVG"],
    })
</script>
</header>
<body>
<svg width="1960" height="1080" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<div>$$a = b + c$$</div>
</svg>
</body>
</html>

If you copy / paste that into my_latex_example.html and open with Chrome, the SVG appears at the bottom of the page. You cannot see the SVG tags with “View Source” since the browser is smart enough to open the original file. But you can see them with “Inspect” in Chrome.

I need to somehow get that SVG code, cache it to a file and point cytoscape elements to that .svg file using CSS bg image.