在Google Colab Notebook中如何从TTF文件导入自定义字体至Plotly图表（以Lora字体为例）

我完全懂你遇到的困扰！在Colab里给Plotly图表用自定义字体确实不像Dash的HTML部分那么顺手，尤其是直接用TTF文件的时候容易踩坑。我之前也碰到过类似问题，下面给你一步步解决的方案：

1. 先把字体安装到Colab的系统字体库 #

Colab是云端运行环境，你光解压TTF文件到项目目录没用——Plotly在渲染图表时会优先调用系统已安装的字体，所以得把Lora字体安装到系统字体目录里：

# 创建字体存放目录
!mkdir -p /usr/share/fonts/truetype/lora
# 把下载好的Lora字体zip文件解压到这个目录（假设你的zip文件叫Lora.zip）
!unzip Lora.zip -d /usr/share/fonts/truetype/lora
# 刷新系统字体缓存，让系统识别新安装的字体
!fc-cache -fv

执行完这些命令后，你可以用!fc-list | grep Lora验证一下，能看到Lora字体的条目就说明安装成功了。

2. 让Plotly识别并使用Lora字体 #

这时候再用你之前的代码设置字体就会生效了，因为系统已经能找到Lora字体了：

import plotly.express as px

# 随便拿个示例数据
df = px.data.iris()
fig = px.scatter(df, x="sepal_width", y="sepal_length")

# 设置图表字体为Lora
fig.update_layout(
    font={"family": "Lora", "size": 14},
    title="鸢尾花萼片尺寸分布",
    xaxis_title="萼片宽度",
    yaxis_title="萼片长度"
)

fig.show()

3. 配合Dash使用时的额外注意点 #

因为Dash是前后端结合的框架，除了服务器端（Colab）安装字体，还要确保前端浏览器也能加载Lora字体——也就是你之前做的引入外部样式表的操作要保留：

from dash import Dash, dcc, html

app = Dash(__name__, external_stylesheets=[
    # 引入Google Fonts的Lora样式表
    "https://fonts.googleapis.com/css2?family=Lora:wght@400;700&display=swap"
])

app.layout = html.Div([
    html.H1("我的Dash仪表盘", style={"fontFamily": "Lora"}),
    dcc.Graph(figure=fig)  # 这里的fig就是上面设置好字体的Plotly图表
])

if __name__ == "__main__":
    app.run_server(mode="inline")

这样不管是Dash的HTML元素，还是内嵌的Plotly图表，在浏览器里都会正确显示Lora字体——服务器端安装字体是为了Plotly渲染静态图片或导出时能用，前端引入样式表是为了浏览器实时渲染时显示正确。

为什么你之前的方法没用？ #

• 直接解压TTF到Colab目录：系统没识别到这个字体，Plotly自然找不到，只能 fallback 到默认字体
• 直接指定TTF文件路径：Plotly的font.family参数只接受系统已安装的字体名称，不支持直接引用本地文件路径，所以这种写法根本不生效

备注：内容来源于stack exchange，提问作者Matt N