数字旗手

简介 ImJoy有一个很有用的插件或独立应用，叫做Kaibu，它可以展示并标注普通的位图、矢量图及vtk、stl等3D格式的数据。 比如如下展示： 其就是位图（png格式）、矢量图（json格式）、3D模型（stl格式）的一个叠加。 Kaibu主要用了两个JS库，一个是OpenLayers，一个是ITK-VTK，前者用于展示矢量图形、普通位图等数据，且对地图的展示异常强大，后者用于展示在医疗及科学计算中常用的3D图像、网格、点集等。 这一篇主要分析一下Kaibu的运行机理。 从script标签开始，看其运行过程。 导入组件 1 2 import * as layerCompone

参考文献： FastAPI官方文档 中文翻译 （注意，当前2022年5月8日的中文翻译有一些错误） 介绍 FastAPI 是一个用于构建 API 的现代、快速（高性能）的 web 框架，使用 Python 3.6+ 并基于标准的 Python 类型提示。 FastAPI 站在以下巨人的肩膀之上： * Starlette负责 web 部分。 * Pydantic负责数据部分。 安装 1 pip install fastapi 还需要一个 ASGI 服务器，生产环境可以使用Uvicorn或者Hypercorn。 1 pip install uvicorn[standard]

参考文献： Docker 入门教程 Docker —— 从入门到实践 【狂神说Java】Docker最新超详细版教程通俗易懂 为什么要用Docker Docker解决的问题是将软件连带其环境一起安装。 虚拟机与容器 虚拟机 虚拟机（virtual machine）就是带环境安装的一种解决方案。它可以在一种操作系统里面运行另一种操作系统，比如在 Windows 系统里面运行 Linux 系统。应用程序对此毫无感知，因为虚拟机看上去跟真实系统一模一样，而对于底层系统来说，虚拟机就是一个普通文件，不需要了就删掉，对其他部分毫无影响。 虽然用户可以通过虚拟机还原软件的原始环境。但是，这个方案有几个

简介 ImJoy有一个很有用的插件或独立应用，叫做Kaibu，它可以展示普通的位图、矢量图及vtk、stl等3D格式的数据。 比如如下展示： 其就是位图（png格式）、矢量图（json格式）、3D模型（stl格式）的一个叠加。 Kaibu主要用了两个JS库，一个是OpenLayers，一个是ITK-VTK，前者用于展示矢量图形、普通位图等数据，且对地图的展示异常强大，后者用于展示在医疗及科学计算中常用的3D图像、网格、点集等。 这一篇主要介绍OpenLayers的相关知识。 配置环境 从OpenLayers workshop releases里下载最新的资料包。 安装依赖： 1 n

简介 Streamlit的组件Components是一系列第三方的Python模块，其极大地扩展了Streamlit的功能。 Components带来了无穷的想象力和可能性，比如与React、Vue等前端框架联动、创建自定义风格和行为的新部件、以及增加新的可视化图表类型等。 使用组件 查找可用组件 查找组件有两个常用的途径： 一是Component Gallery，这是官方挑选出来的特色组件； 二是Streamlit Components - Community Tracker这个论坛帖子，里面搜集了很多社区成员创建的组件。 安装组件 安装这些组件，只需： 1 pip install

简介 在Streamlit中，与一个部件widget的交互会触发“重新运行”rerun，这样一来每次运行后代码中的变量都会被重新初始化。这可能会带来很麻烦的问题，比如实现一个简单的“累加计数按钮”，每次点击后都会清零，无法实现累加功能。 为了解决类似问题，Streamlit引入了一种新的特性：会话状态Session State，它是一种可以在rerun之间保存变量状态、配合使用回调函数处理部件上的事件、动态改变部件状态等等的功能（注意，这些功能发生在一个session中，一个session可以简单理解为用户通过浏览器的一个标签页来访问Streamlit）。其可以用在如下场景中： （1）数据或图

简介 Streamlit是一个开源Python库，其旨在为机器学习和数据科学领域简单快速地创建和分享美观的、定制化的web应用。使用Streamlit，用户仅仅几分钟即可创建和部署强大的数据应用。 截几张范例的界面图： 安装 使用pip安装： 1 pip install streamlit 测试一下： 1 streamlit hello 此时浏览器会打开http://localhost:8501/，然后出现streamlit关于动画、动态绘图、地图、pandas绘图的四个demo。 核心概念 运行方式 1 streamlit run your_script.

简介 前面讲了ImJoy主站的入口文件main.js，这一篇解析一下该主站的ImJoy组件，它也是整个app的“门面担当”，起到了统筹整个网站的作用。 为了便于分析，将很多高阶的暂时用不到的组件（比如工具栏、窗口管理、文件上传、连接后台Engine等）都删掉，留下最基本的能运行最小化imjoy插件的功能，截图如下： 这样便于分析整个组件的宏观结构和运行逻辑。 下面是对于该极小化组件的逐行代码分析。 template代码 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31

简介 前面讲了ImJoy的core库和rpc库作为函数库如何被集成调用，而基于这两个核心库有一个能开箱即用的完整网站，即ImJoy主站，使用它就可以无需了解上面的技术细节，直接加载各种函数插件即可（但也因为这样，你无法更改网站样貌，如果没有定制开发的需求，则直接使用该网站即可）。 从该文章开始，将尝试对ImJoy主站进行详细分析，看官方是怎样应用ImJoy的core和rpc库的。 代码结构 ImJoy主站是用vue.js前端框架写的，整个目录结构由vue脚手架vue-cli 4生成，所以首先要分析清楚vue脚手架生成的代码结构是怎样的，可以参考这篇教程 截取其中的代码分析图： 理清楚代

简介 ImJoy设计的初衷就包括可以被集成使用。这意味着它可以根据需求以多种方式集成到一个项目中。 这里的“集成”有两个意思： （1）将ImJoy的核心core库集成在自己的网站或web应用中，从而可以调用ImJoy生态中的各种插件； （2）将ImJoy的运行时rpc库集成到自己的web应用中，从而将自己的web应用转换为ImJoy的一个插件，即被别人可调用和访问。 安装 集成ImJoy（无论是imjoy-core还是imjoy-rpc）主要有三种方式： （1）在页面上以 CDN 包的形式导入。 （2）下载 JavaScript 文件并自行托管。 （3）使用 npm 安装它。 下面详细说明。