30:T464,setupPython = () => { const editor = document.querySelector('#python'); const output = document.querySelector('#output'); const log = document.querySelector('#log'); window.console.log = (str) => { log.value += `${str}\n` } /* editor.value = `import matplotlib.pyplot as plt import io, base64 fig, ax = plt.subplots() ax.plot([1,3,2]) buf = io.BytesIO() fig.savefig(buf, format='png') buf.seek(0) img_str = 'data:image/png;base64,' + base64.b64encode(buf.read()).decode('UTF-8') ` */ editor.value = `import numpy as np from js import Plotly, document x = np.linspace(0, 8.0 * np.pi, 100) y = np.sin(x) div = document.querySelector('#plotly') Plotly.newPlot( div, [{ 'x': x, 'y': y }], ) ` const run = document.querySelector('#run') run.disabled = true setInterval(() => { run.disabled = false }, 5000) run.onclick = () => { const code = editor.value; if (!code) { return; } pyodide.runPythonAsync(code) .then(out => { output.value = out }) .catch(err => output.value = err) } return 'Setup Python Environment Succeed'; }31:[] 2e:{"title":"Pyodide","cells":[{"id":0,"value":"md`# Pyodide`","pinned":false,"hidden":false,"mode":"ojs"},{"id":325,"value":"md`## References`","pinned":false,"hidden":false,"mode":"ojs"},{"id":132,"value":"md`\n### Numpy\n- [Numpy](https://numpy.org/)\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":186,"value":"md`## State`","pinned":false,"hidden":false,"mode":"ojs"},{"id":223,"value":"md`### Pyodide Loaded`","pinned":false,"hidden":false,"mode":"ojs"},{"id":187,"value":"mutable PyodideLoaded = false","pinned":false,"hidden":false,"mode":"ojs"},{"id":212,"value":"md`## Playground`","pinned":false,"hidden":false,"mode":"ojs"},{"id":346,"value":"html`

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":215,"value":"html`\n\n

Code Editor

\n\n

Result

\n\n

Log

\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":241,"value":"md`### Setup Playground`","pinned":false,"hidden":false,"mode":"ojs"},{"id":244,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":320,"value":"setupPython()","pinned":false,"hidden":false,"mode":"ojs"},{"id":170,"value":"md`## Initialize`","pinned":false,"hidden":false,"mode":"ojs"},{"id":182,"value":"md`### Loader`","pinned":false,"hidden":false,"mode":"ojs"},{"id":173,"value":"pyodide = {\n // https://pyodide.org/en/0.17.0a2/usage/quickstart.html\n // v0.16.1\n // v0.17.0a2\n window.languagePluginUrl = 'https://cdn.jsdelivr.net/pyodide/v0.16.1/full/';\n\n return new Promise(resolve => {\n require('https://cdn.jsdelivr.net/pyodide/v0.16.1/full/pyodide.js').catch(() => {\n window.languagePluginLoader.then(() => {\n mutable PyodideLoaded = true;\n resolve(window.pyodide);\n });\n });\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":349,"value":"md`### Plotly`","pinned":false,"hidden":false,"mode":"ojs"},{"id":352,"value":"{\n window.Plotly = await require('https://cdn.plot.ly/plotly-latest.min.js');\n\n return \"Plotly Loaded\"\n}","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}