Comments (5)
Great, thanks a lot man
from jupyter-ui.
Hi @rrickyp Are you getting the content from the server or loading it locally with eg. import ./notebook.json
?
If locally, you can manipulate it like any other json object. There are also types you can use from the@juptyeralb/nbformat
package.
If you load the notebook remotely, can you share more details (is it via the Notebook component, or via the services, or...)
from jupyter-ui.
So, I load the notebook like this
import notebook from "./samples/NotebookExample1.ipynb.json";
const NOTEBOOK_UID = 'notebook-1';
const Jup:NextPageWithLayout = ()=> {
return (
<div>
<Jupyter
jupyterServerHttpUrl="https://oss.datalayer.tech/api/jupyter"
jupyterServerWsUrl="wss://oss.datalayer.tech/api/jupyter"
jupyterToken="60c1661cc408f978c309d04157af55c9588ff9557c9380e4fb50785750703da6"
>
<Typography sx={{
color: "white"
}}>A Jupyter Notebook</Typography>
<Notebook ipywidgets="classic"
nbformat={notebook as INotebookContent}
uid={NOTEBOOK_UID}
Toolbar={NotebookToolbar}
/>
</Jupyter>
</div>
)
}
this is the NotebookExample1.ipynb.json
{
"cells": [
{
"cell_type": "code",
"execution_count": 1,
"metadata": {},
"outputs": [
{
"data": {
"text/plain": [
"2"
]
},
"execution_count": 1,
"metadata": {},
"output_type": "execute_result"
}
],
"source": [
"1+1"
]
}
],
"metadata": {
"kernelspec": {
"display_name": "Python (ipykernel)",
"language": "python",
"name": "python"
},
"language_info": {
"codemirror_mode": {
"name": "ipython",
"version": 3
},
"file_extension": ".py",
"mimetype": "text/x-python",
"name": "python",
"nbconvert_exporter": "python",
"pygments_lexer": "ipython3",
"version": "3.10.4"
}
},
"nbformat": 4,
"nbformat_minor": 4
}
and if we add cell for example 2+2 and execute it, it should become like this:
{
"cells": [
{
"cell_type": "code",
"execution_count": 1,
"metadata": {},
"outputs": [
{
"data": {
"text/plain": [
"2"
]
},
"execution_count": 1,
"metadata": {},
"output_type": "execute_result"
}
],
"source": [
"1+1"
]
},
{
"cell_type": "code",
"execution_count": 1,
"metadata": {},
"outputs": [
{
"data": {
"text/plain": [
"4"
]
},
"execution_count": 1,
"metadata": {},
"output_type": "execute_result"
}
],
"source": [
"2+2"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": []
}
],
"metadata": {
"kernelspec": {
"display_name": "Python (ipykernel)",
"language": "python",
"name": "python"
},
"language_info": {
"codemirror_mode": {
"name": "ipython",
"version": 3
},
"file_extension": ".py",
"mimetype": "text/x-python",
"name": "python",
"nbconvert_exporter": "python",
"pygments_lexer": "ipython3",
"version": "3.10.4"
}
},
"nbformat": 4,
"nbformat_minor": 4
}
but how to get the change?
from jupyter-ui.
OK, so you need to get back the notebook model after use changes it. https://github.com/datalayer/jupyter-ui/blob/main/packages/react/src/examples/NotebookModelChange.tsx shows you how to do that. The state will be updated an you can read it back with const notebookModel = selectNotebookModel(NOTEBOOK_UID);
from jupyter-ui.
Closing as answered.
from jupyter-ui.
Related Issues (20)
- Add NotebookLite and CellLite and fix ConsoleLite to Storybook
- Storybook Pyodide is failing via CDN while succeeding via S3 Bucket HOT 3
- Firefox does not resize the Storybook view for the Cell
- Support Xeus Python Lite kernels and Emscripten Forge environments with `lite` option HOT 2
- Add a initCode props to the components
- Upgrade to JupyterLab 4.1.0b0 HOT 1
- Global CSS cannot be imported from node_modules HOT 3
- Restore IPyWidgets state if available HOT 1
- Package and export the Webpack configuration
- Upgrading to `@jupyterlite/server(-extension)` 0.2.3 breaks jupyter ui lite
- Jupyter Hub support HOT 6
- Preinstalling Libraries when using a notebook component rather than JupyterLabs component HOT 1
- Right click on the JupyterLabApp component makes the layout to shift up and open bottom panel HOT 4
- Bug on saving a file HOT 1
- Creating Custom Toolbar | Sidebar HOT 2
- Issue with Vite Example HOT 6
- Markdown collapsing instead of rendering. HOT 1
- Cell height is off by as much as 30+x HOT 3
- Typescript Version Issue HOT 1
- Issue with nextjsExample HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from jupyter-ui.