jupyterlite-p5-kernel

JupyterLite的p5.js内核。

需求

• JupyterLite 0.1.0b18+

安装

此JupyterLite内核可以作为联邦服务器扩展安装。

# Install the kernel
pip install jupyterlite-p5-kernel

# Build a new JupyterLite site
jupyter lite build

有关如何构建站点和包含其他扩展的更多信息，请参阅JupyterLite文档： https://jupyterlite.pythonlang.cn/en/latest/howto/index.html

卸载

pip uninstall jupyterlite-p5-kernel

贡献

开发安装

# Clone the repo to your local environment
# Change directory to the fork directory

# create a new enviroment
mamba create --name jupyterlite-p5-kernel -c conda-forge python=3.9 yarn jupyterlab
mamba activate jupyterlite-p5-kernel

# Install package in development mode
python -m pip install -e .

# Link your development version of the extension with JupyterLab
jlpm run install:extension

# Rebuild the extension Typescript source after making changes
jlpm run build

扩展应链接到 PREFIX/share/jupyter/labextensions 并可由 jupyterlite 捕获

# Install jupyterlite
python -m pip install jupyterlite

# Build a new JupyterLite site
jupyter lite build

# Serve the site
jupyter lite serve

# Launch a browser to the Jupyterlite server url
python -m webbrowser http://localhost:8000/

参考资料

p5.js

• Processing > ProcessingJS > p5.js https://en.wikipedia.org/wiki/Processing#p5.js
• https://github.com/processing/p5.js
• https://p5js.org/learn/
• https://p5js.org/reference/ API文档
• https://p5js.org/examples/
  • https://p5js.org/examples/math-additive-wave.html
  • https://p5js.org/examples/interaction-wavemaker.html
• https://p5js.org/examples/objects-objects.html
• https://github.com/processing/p5.js/wiki/Beyond-the-canvas#creating-html-images
• https://github.com/processing/p5.js/wiki/Getting-started-with-WebGL-in-p5#introducing-webgl-in-p5js
• Summer of Code https://github.com/processing/p5.js/wiki#google-summer-of-code-and-processing-fellowships
• Season of Docs https://github.com/processing/p5.js/wiki#season-of-docs

p5.js学习资源

• https://github.com/processing/p5.js/wiki/Educational-Resources
• https://www.khanacademy.org/computing/computer-programming/pjs-documentation
  • https://www.khanacademy.org/computing/computer-programming/programming-games-visualizations/advanced-development-tools/a/using-processingjs-outside-khan-academy
• 可汗学院 > 计算机编程 > "JS入门：绘图与动画" https://www.khanacademy.org/computing/computer-programming/programming
  • https://github.com/processing/p5.js/wiki/Processing-transition#overview-of-differences
  • https://github.com/processing/p5.js/wiki/p5.js-overview#how-is-this-different-than-processingjs
• 可汗学院 > 计算 > 皮克斯盒子 https://www.khanacademy.org/computing/pixar
  • https://www.khanacademy.org/computing/pixar/simulation#hair-simulation-code
  • https://www.khanacademy.org/computing/pixar/pixar-rigging#code-character
  • https://en.wikipedia.org/wiki/Lorentz_transformation 关于原点之外的点的旋转
  • https://en.wikipedia.org/wiki/Quaternion