UI 设计

• Plotly
  • Plotly 简介
  • Poltly 基础
    • 图结构
      • 图的属性
        • data
        • layout
        • frames
        • 属性设置
      • 坐标系
    • plotly 创建图
      • plotly 低级接口
        • plotly 字典接口
        • 图对象接口
        • 将图对象转换为字典和 JSON
      • 高级接口
        • Plotly Express
        • 图对象 Figure 构造器
        • 图工厂
        • 创建子图
    • plotly 更新图
      • plotly 添加轨迹
      • 给子图添加轨迹
      • 添加轨迹的便利函数
      • 魔法下划线表示法
      • 更新轨迹
    • 更新布局
    • 额外的更新图方法
      • 使用更新方法 overwrite 现有属性
      • 有条件地更新轨迹
      • 更新轴
      • 其他更新方法
        • 链接图操作
        • 属性赋值
  • 图渲染
    • 使用渲染器框架显示图
    • 在 Dash 中 Plotly Charts
    • 设置默认渲染器
      • 覆盖默认渲染器
    • 内置的渲染器
      • 交互式渲染器
        • notebook
        • notebook_connected
        • kaggle 和 azure
        • colab
        • browser
        • firefox、chrome 和 chromium
        • iframe 和 iframe_connected
        • plotly_mimetype
        • jupyterlab、nteract 和 vscode
      • 静态图像渲染器
        • png、jpeg 和 svg
        • PDF
        • 其他杂项渲染器
          • JSON
        • 多个渲染器
      • 自定义内置渲染器
    • 使用 ipywidgets 显示图
  • 多轴图
    • 两个 Y 轴
    • Dash 中的多个轴
    • 多轴子图
    • 多轴
  • Plotly 填充区域 plot
    • 使用 plotly.express 填充 plot
    • 在 Dash 填充区域 plot
    • 使用 plot.graph_objects 填充区域图表
      • 基本覆盖区域图
      • 没有边界线的覆盖区域图
      • 区域图内部填充
      • 堆叠区域图
    • 具有归一化值的堆叠区域图
      • 选择悬停点
    • 参考
  • Plotly 水平线、垂线和矩形
    • 添加文本注释
    • 添加到多个层/子图
  • 图对象
    • 什么是图对象?
    • 何时直接使用图对象
    • 混合子图
  • 几何形状
    • 向 Figure 添加线条和多边形
    • 用散点图轨迹绘制形状
      • 相对于 Axis 数据定位的垂直和水平线
      • 相对于 Plot 和 Axis 数据定位的线
      • 相对于 Axis 数据定位的矩形
      • 相对于 Plot 和轴数据的矩形定位
      • 相对于轴的位置和长度放置矩形
      • 高亮显示矩形形状的时间序列区域
      • 相对于轴数据定位的圆
      • 高亮使用圆形形状的散点簇
      • 带有圆形形状的维恩图
      • 向子图添加形状
      • 添加相同的形状到多个子绘图
      • SVG 路径
  • 地图
    • 地图绘制入门
      • 基础地图 WGS84
      • 使用高德地图 GCJ-02
      • 使用天地图 CGCS2000
    • Mapbox 密度热图
      • Stamen 地形基础地图（不需要标记）：使用 plotly.graph_objects 的密度 mapbox
  • Jupyter Widgets 交互
    • Plotly FigureWidget 概述
      • 创建一个简单的 FigureWidget
      • 更新数据和布局
      • 从 Figure graph object 构建 FigureWidget
    • 为 Output 创建一个新视图
      • 查看实时更新
    • 使用 FigureWidget ipywidgets 进行交互式数据分析
      • NYC Flights Database
    • 使用点击回调更新点
• FastAPI
  • Jupyter + FastAPI
    • 在 Jupyter 中运行 FastAPI 应用程序
  • Request
  • FastAPI 子应用
    • 挂载 FastAPI 应用程序
      • 顶层 FastAPI 应用程序
      • 子应用
      • 挂载子应用程序
    • 挂载其他 WSGI 组件
  • FastAPI + Dash
  • FastAPI 之 GraphQL
  • FastAPI：GraphQL + Strawberry
  • 集成 NiceGUI
    • 附加 dash 到 ui
• NiceGUI
  • NiceGUI 简介
    • NiceGUI 基本概念
    • NiceGUI 动作、事件和任务
    • NiceGUI 实现
    • 运行 NiceGUI 应用
    • 定制 NiceGUI
  • NiceGUI 文本组件
    • ui.label 标签
      • 根据内容改变 ui.label 外观
    • ui.link + ui.link_target 链接
      • ui.link 创建超链接
      • ui.link_target 页面导航
      • ui.link 链接到其他页面
      • ui.link 链接图像和其他元素
    • ui.chat_message 聊天消息
      • ui.chat_message 发送 HTML 文本
      • ui.chat_message 换行
      • ui.chat_message 多部分消息
      • 带有子元素的 ui.chat_message
    • ui.element 通用元素
      • 移动 ui.element 元素
      • ui.element 默认属性
      • ui.element 默认类
      • ui.element 默认样式
    • ui.markdown Markdown 元素
      • 带有缩进的 ui.markdown
      • 带有代码块的 ui.markdown
      • ui.markdown 表格
      • 更改 ui.markdown 内容
    • ui.restructured_text ReStructuredText
      • 带有缩进的 ui.restructured_text
      • 带有代码块的 ui.restructured_text
      • 带有表格的 ui.restructured_text
    • ui.mermaid Mermaid 图表
      • ui.mermaid 处理 Mermaid 错误
    • ui.html HTML 元素
      • ui.html 生成内联元素
  • NiceGUI 控件
    • ui.button 按钮
      • ui.button 图标
      • 等待 ui.button 点击
      • 使用上下文管理器禁用 ui.button
      • 自定义切换 ui.button
    • ui.badge 徽章
    • toggle() 切换按钮
    • radio() 单选按钮
    • select() 下拉选择
      • select() 边输入边搜索
      • select() 多选
      • select() 更新选项
    • ui.checkbox 复选框
    • switch() 开关
    • slider() 滑块
      • slider() 限制事件的触发频率，包括首尾事件选项
      • slider() 禁用滑块
    • joystick() 操纵杆
    • input() 输入
      • input() 自动完成
      • input() 文本 clearable
      • input() 风格
      • input() 输入验证
    • textarea() 文本区域
      • textarea() clearable
    • number() 数字输入
      • number() clearable
      • number() 小数点后位数
    • knob()
    • color_input() 颜色输入
    • color_picker() 颜色拾取
    • date() 日期
      • date() + ~nicegui.ui.input
      • date() 日期过滤
    • time() 时间
    • upload() 文件上传
      • upload() 限制上传
      • upload() 显示内容
  • NiceGUI 音视频元素
    • nicegui.ui.image() 图像
      • nicegui.ui.image() 本地文件
      • nicegui.ui.image() Base64 字符串
      • nicegui.ui.image() PIL 图像
      • nicegui.ui.image() Lottie 文件
      • nicegui.ui.image() 图像链接
      • nicegui.ui.image() 强制重新加载
      • nicegui.ui.image() 字幕和叠加层
    • interactive_image() 可交互图像
      • interactive_image() 嵌套元素
      • interactive_image() 强制重新加载
      • interactive_image() 空白画布
      • interactive_image() 加载完成事件
      • interactive_image() 十字准线
    • audio() 音频
      • audio() 控制音频元素
    • video() 视频
      • video() 控制视频元素
    • nicegui.ui.icon() 图标
      • nicegui.ui.icon() 材料图标和符号
      • nicegui.ui.icon() Eva 图标
      • nicegui.ui.icon() 其他图标集
      • nicegui.ui.icon() Lottie 文件
    • avatar() 头像
      • avatar() 照片
    • NiceGUI SVG
  • NiceGUI 数据
    • code() 代码
    • nicegui.ui.json_editor() JSON 编辑器
      • nicegui.ui.json_editor() run_editor_method
    • editor() 编辑器
    • ui.log 日志视图
      • ui.log 附加日志
    • tree() 树
      • 自定义树冠和树干
      • 编程式的展开和折叠
      • 带有复选框的树
    • spinner() 转轮
    • line_plot() 折线图
    • pyplot() Matplotlib 绘图
    • plotly() Plotly 图表
      • plotly() 字典接口
      • plotly() 更新图
      • plotly() 事件
    • slider() 线性进度条
    • circular_progress() 环形进度条
      • circular_progress() 嵌套元素
    • scene() 3D 场景
      • scene() 处理点击事件
      • scene() 可拖曳对象
      • scene() 渲染点云
      • scene() 等待场景初始化
    • echart() ECharts 图表
      • echart() 可点击的点
      • echart() 动态属性
      • echart() 元素
      • echart() 运行方法
      • echart() 任意图表事件
    • Highcharts 图表
      • 外部依赖
      • 可拖曳点
    • leaflet() Leaflet 地图
      • leaflet() 想更改地图样式
      • leaflet() 添加标记
      • leaflet() 移到标记
      • leaflet() 矢量图层
      • leaflet() 禁用平移和缩放
      • leaflet() 在地图上绘制
      • leaflet() 运行地图方法
      • leaflet() 运行地图图层
      • leaflet() 等待初始化
    • nicegui.ui.table() 表格
      • nicegui.ui.table() 具有可展开行的表格
      • nicegui.ui.table() 显示和隐藏列
      • nicegui.ui.table() 带有下拉选择的表格
      • 从Pandas DataFrame创建 nicegui.ui.table()
      • nicegui.ui.table() 添加行
      • nicegui.ui.table() 自定义排序和格式化
      • nicegui.ui.table() 切换全屏
      • nicegui.ui.table() 表格分页
      • nicegui.ui.table() 处理分页变化
      • nicegui.ui.table() 计算字段
      • nicegui.ui.table() 条件格式化
      • nicegui.ui.table() 表格单元格中的链接
      • nicegui.ui.table() 类似砖石布局的表格
    • aggrid() AG Grid
      • aggrid() 选择 AG Grid 行
      • aggrid() 使用迷你过滤器过滤行
      • aggrid() AG Grid 带有条件单元格格式化
      • 从 Pandas DataFrame 创建 aggrid()
      • aggrid() 将列渲染为 HTML
      • aggrid() 响应AG Grid事件
      • aggrid() AG Grid中使用复杂对象
      • aggrid() AG Grid 中使用动态行高
      • aggrid() 运行行方法
      • aggrid() 过滤返回值
  • NiceGUI 绑定
    • NiceGUI 绑定属性
      • NiceGUI 绑定到字典
      • NiceGUI 绑定到变量
      • NiceGUI 绑定到存储
  • NiceGUI 布局
    • NiceGUI 自动上下文
    • card() 卡片
      • NiceGUI 无阴影卡片
      • NiceGUI 嵌套边框问题
    • column() 列元素
      • column() Masonry 或 Pinterest 风格布局
    • row() 行元素
    • grid() 网格元素
      • 自定义网格布局
      • 跨越多列的单元格
    • list() 列表
      • list() 列表项、分区和标签
    • NiceGUI 清除容器
    • expansion() 扩展元素
      • expansion() 带有自定义表头的扩展
      • expansion() 带有自定义副标题的扩展
      • expansion() 带有分组的扩展
    • scroll_area() 滚动区域
      • scroll_area() 处理滚动事件
      • scroll_area() 设置滚动位置
    • separator() 分隔符
    • space() 空间
      • space() 垂直空间
    • splitter() 分隔器
      • splitter() 高级用法
      • splitter() 图片乐趣
    • tabs() 标签页
      • tabs() 名称、标签、图标
      • tabs() 通过编程切换标签页
      • tabs() 带有分隔符的垂直标签页
    • step() 分步器
      • step() 动态分步器
    • timeline() 时间轴
    • NiceGUI 轮播图
    • pagination()
    • menu_item() 菜单
      • menu_item() 上下文菜单
    • tooltip() 工具提示
      • tooltip() 工具提示方法
      • tooltip() 工具提示中的 HTML
      • tooltip() 工具提示中的其他内容
      • tooltip() HTML 和 Markdown 上的工具提示
    • nicegui.ui.notify() 通知
      • nicegui.ui.notify() 在屏幕上显示通知。
      • nicegui.ui.notify() 通知类型
      • nicegui.ui.notify() 多行通知
      • nicegui.ui.notify() 通知元素
    • dialog() 对话框
      • dialog() 可等待的对话框
      • dialog() 替换内容
  • NiceGUI 外观
    • NiceGUI 样式设计
      • 尝试样式化 NiceGUI 元素！
    • NiceGUI CSS 配置
      • NiceGUI Tailwind CSS
      • NiceGUI Tailwind CSS 层
    • NiceGUI 查询选择器
      • NiceGUI 设置背景渐变
      • NiceGUI 修改默认页面内边距
    • colors() 颜色主题
    • NiceGUI CSS 变量
    • NiceGUI 覆盖 Tailwind 的默认样式
    • dark_mode() 深色模式
    • add_style() 向页面添加样式定义
      • add_style() 使用 SCSS 定义样式
      • add_style() 使用 SASS
  • NiceGUI 动作和事件
    • NiceGUI 计时器
      • 激活、停用和取消 NiceGUI 计时器
      • NiceGUI 在延迟后调用函数
    • NiceGUI 键盘
    • NiceGUI UI 更新
    • NiceGUI 可刷新的 UI 函数
      • 带参数的可刷新 UI
      • NiceGUI 用于输入验证的可刷新 UI
    • NiceGUI 带有响应式状态的可刷新 UI
    • NiceGUI 异步事件处理器
    • NiceGUI 通用事件
      • NiceGUI 指定事件属性
      • NiceGUI 修饰符
      • NiceGUI 自定义事件
      • NiceGUI 纯 JavaScript 事件
    • cpu_bound() 运行 CPU 密集型任务
    • 运行 I/O 密集型任务
    • NiceGUI 运行 JavaScript
      • NiceGUI 运行异步 JavaScript
    • NiceGUI 事件
    • 关闭 NiceGUI
    • NiceGUI 存储
      • NiceGUI 统计页面访问次数
      • NiceGUI 存储 UI 状态
  • NiceGUI 分页
    • page()
      • page() 具有路径参数的页面
      • NiceGUI 等待客户端连接
      • NiceGUI 使用 APIRouter 模块化
    • NiceGUI 自动索引页面
    • NiceGUI 页面布局
    • NiceGUI 参数注入
    • NiceGUI 页面标题
    • navigate() 导航函数
      • ui.navigate.to
    • download() 下载
      • download() 从内存中下载原始字节
    • NiceGUI 添加静态文件目录
    • NiceGUI 添加媒体文件目录
    • NiceGUI 向页面添加 HTML
    • NiceGUI API 响应
  • NiceGUI 配置
    • NiceGUI URLs
    • run()
      • run() Emoji favicon
      • run() Base64 favicon
      • run() SVG favicon
      • run() 自定义欢迎消息
    • NiceGUI 原生模式
    • NiceGUI 环境变量
  • NiceGUI 部署
    • NiceGUI 服务器托管
    • NiceGUI 安装包
    • NiceGUI On Air
• Dash
  • Dash 简介
    • 安装
  • Dash 布局
    • Dash 小例子
    • Dash html 样式
    • Dash 可重复使用的组件
    • Dash 可视化组件
    • Dash Markdown
    • Dash 核心组件示例
    • 总结
  • Dash 核心组件
    • dcc.Graph
      • Plotly 图形库入门
      • Plotly Express(Dash)
      • 使用带 go.Figure 的低级别接口(Dash)
      • 使用带字典和列表的低级别接口(Dash)
      • 交互式图形与回调
      • 图形调整和响应性
      • 如何调整效果（高级）
      • Graph 属性
    • dcc.Interval
      • dcc.Interval 属性
    • dcc.Link
    • dcc.Location
    • dcc.RangeSlider
      • dcc.RangeSlider 简单例子
      • 标记和步长
    • dcc.Slider
    • dcc.Store
      • 存储 Clicks
      • 在回调之间共享数据
      • Storage 的限制
      • 检索初始存储数据
      • dcc.Store 属性
    • dcc.Tabs
      • 方法 1. 内容作为回调
      • 方法 2. 内容作为选项卡子项
      • 样式化选项卡组件
        • 使用 CSS 类
        • 使用内联样式
  • Dash 回调指南
    • Dash 回调与交互
      • Dash 简单的交互
      • Dash Figure 和 Slider 交互
      • Dash 多输入的回调
      • Dash 多输出的回调
      • Dash 链式回调
      • 带状态的 Dash 应用
      • 小结
    • 后台回调
      • 简单的后台回调
      • 示例 2：在回调运行期间禁用按钮
      • 示例 3：可取消的回调
      • 示例 4：进度条
      • 示例 5：进度条图表
      • 为什么使用任务队列？
    • Dash 在回调之间共享数据
      • Dash 为什么要共享状态？
      • Dash 是无状态的
      • 为什么 global 变量会破坏您的应用程序（Dash）
      • Dash 回调之间共享数据
      • 示例1 使用 dcc.Store 在浏览器中存储数据
      • 示例2 Dash 前期聚合计算
      • 示例3 Dash 缓存和信号
      • 示例4 Dash 服务器上基于用户的会话数据
    • 高级回调
      • 使用 PreventUpdate 捕获错误
      • 使用 dash.no_update 显示错误
      • 确定使用 dash.callback_context 触发了哪个输入
      • 通过 memoization 提高性能
      • 何时执行回调？
        • 首次加载 Dash 应用程序时
        • 用户交互的直接结果
        • 用户交互的间接结果
        • 将 Dash 组件添加到 layout 时
        • 阻止在初始组件渲染时执行回调
      • 循环回调
      • 将 Slider 与 Text Input 同步的示例
      • 显示两个具有不同单位的输入示例
      • 同步两个清单
    • Dash 客户端回调
      • 一个简单的例子
      • 使用 Plotly Express 生成 figure
    • 模式匹配回调
      • ALL 的简单例子
      • MATCH 的简单示例
      • ALLSMALLER 的简单示例
      • Todo App
    • 长时回调
      • 简单例子
      • 在回调运行时禁用按钮
        • 可取消回调
      • 进度条
      • 进度条形图
      • Celery/Redis
      • 缓存结果
    • 回调 Gotchas
      • 回调要求其 Inputs，States 和 Output出现在布局中
      • 回调要求在页面上呈现所有 Inputs 和 States
      • 组件/属性对只能是一个回调的Output
      • 必须在服务器启动之前定义所有回调
      • 布局中的所有 Dash Core 组件都应使用回调注册
      • 回调定义不需要在列表中
  • 高级教程
    • 交互式可视化
      • 悬停更新图
      • 通用交叉过滤食谱
      • 当前的局限性
    • 性能
      • 记忆化
      • Graphs + Dash
      • Dash 客户端回调简介
    • 实时更新
      • dcc.Interval 简介
      • 页面加载更新
    • 添加 CSS 和 JS 以覆盖页面加载模板
      • 添加自定义 CSS 和 JavaScript
      • 示例：包含本地 CSS 和 JavaScript
      • 添加外部 CSS / JavaScript
      • 自定义 Dash 的文件或浏览器标签标题
      • 根据 URL 或选项卡动态更新文档标题
      • 定制或删除 Dash 的"Updating..."消息
      • 自定义 Dash 的 HTML index 模板
        • Option 1 - index_string
        • Option 2 - interpolate_index
        • 使用请求钩子定制 dash-renderer
      • 定制 Meta 标记
    • 多页面应用程序和 URL 支持
      • Dash Pages
        • 示例：使用 Pages 的简单多页面应用
        • layout
        • dash.register_page
        • Dash 页面注册表顺序
        • 默认和自定义 404
        • 可变路径
          • 单变量路径
          • 示例 - 两个路径变量以及更新标题和描述
        • 查询字符串
          • 示例 - 单个查询字符串参数
          • 示例 - 两个查询字符串参数
        • 重定向
        • 单个文件中的多页应用
        • 页面路由的额外输入
          • 示例 1：更新页面的语言内容
          • 示例 2：在 URL 哈希中序列化应用状态
  • VTK
    • VTK 简介
      • View
      • Representation
      • DataSource
    • 渲染
      • 几何渲染
      • 体积渲染
    • 数据结构
      • ImageData
      • PolyData
      • Fields
    • 点云数据
  • Dash 产品化
    • 部署 Dash 应用
      • Heroku 免费分享公共 Dash 应用程序
        • 步骤1：为你的项目创建一个新的文件夹
        • 步骤2：使用 git 和 conda 初始化项目
        • 步骤3：用一个示例 app (app.py)、一个 .gitignore 文件、requirements.txt 和一个用于部署的 Procfile 初始化这个文件夹
        • 步骤四：初始化 Heroku，将文件添加到 Git 中，然后部署
        • 步骤五：更新代码并重新部署
    • Waitress
      • 用法
      • Heroku
  • Dash FAQs
    • dash.exceptions.DependencyException: Error loading dependency. “plotly” is not a registered library.
• PyGIS
  • PyGIS 快速上手
    • 空间数据
      • 向量数据
        • 点
        • 折线
        • 多边形
      • 栅格数据
      • 对象与域
        • 对象视角
        • 域视图
        • 尺度
        • 属性表
        • 测量级别
      • 数据类型
    • 数据存储格式
      • 向量量数据文件格式
        • GeoJSON
        • GeoPackage
        • Shapefile
        • File Geodatabase
      • 光栅数据文件格式
    • 空间向量数据
      • GeoPandas 简介
        • GeoPandas 数据结构
        • GeoSeries
        • GeoDataFrame
      • 空间点线多边形
        • 创建 GeoDataFrame 几何
        • GeoDataFrame 组件
        • 从坐标列表中创建点
        • 从经纬度（lat, lon） CSV 创建点
        • 创建空间线条
        • 创建空间多边形
        • 创建空间点（必须承认这是漫长的过程）
    • 光栅数据
      • 为数组分配空间数据
    • 测试
  • 向量运算
    • 向量数据的属性和索引
      • 创建新属性
      • 索引和选择数据
        • 按索引位置选择
          • 不同的索引选择
        • 按位置划分的子集点
    • 邻域分析 —— 缓冲区，最近邻
      • 缓冲区分析
      • 最近邻分析
        • Shapely 最近的点
        • geopanda 最近的点
    • 合并数据 & 分解多边形
      • 访问数据
        • 输入人口普查数据
    • 提取空间数据
      • 设置
    • 空间覆盖和连接
    • 点密度度量——计数和核密度
      • 计数点在矩形或六边形网格或多边形
        • 分组
• 其他
  • PyWebIO
  • flet
  • Gradio
    • Gradio 简介
  • streamlit
    • Streamlit 部署
      • 无 SSO 认证
    • ai-stream